Tengo un selector de fecha SyncFusion que estoy usando de la siguiente manera:
var datepicker = null; $("#datepicker").hide(); $("#click").click(function(){ $("#datepicker").show(); datepicker = new ej.calendars.DatePicker({ width: "255px" }); datepicker.appendTo('#datepicker'); }); $("#clickAgain").click(function(){ $("#datepicker").hide(); datepicker.destroy(); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script> <script src="https://cdn.syncfusion.com/ej2/dist/ej2.min.js"></script> <link href="https://cdn.syncfusion.com/ej2/material.css" rel="stylesheet"> <input id="datepicker" type="text"> <a id="click">Click Here</a> <!--<a id="clickAgain">Click Again</a>--> Esto funciona, pero estoy tratando de hacer una cosa aquí, aunque no estoy seguro de si es posible. Cuando hago clic en la etiqueta de anclaje Haga clic aquí , vincula el selector de fecha al elemento HTML . Cuando hago clic de nuevo, se vuelve a vincular y se repite. Así que estoy tratando de reinicializarlo y luego vincularlo al elemento HTML una vez. Intenté usar destroy() de la documentación de SyncFusion y se destruye cuando uso un evento de clic por separado.
Mi preocupación es borrar el elemento adjunto y volver a vincular el objeto del selector de fecha usando el evento de clic Haga clic aquí . ¿Alguna forma de hacerlo?
Puede intentar llamar al método de actualización, que destruye y vuelve a representar el control. Referencia: https://ej2.syncfusion.com/javascript/documentation/api/datepicker#refresh
$("#click").click(function () { if (datepicker) { datepicker.refresh(); } else { $("#datepicker").show(); datepicker = new ej.calendars.DatePicker({ width: "255px" }); datepicker.appendTo('#datepicker'); } });De lo contrario, puede verificar la instancia y luego borrar el elemento adjunto usando destruir y renderizarlo nuevamente según el código a continuación.
$("#click").click(function () { if (datepicker) datepicker.refresh(); $("#datepicker").show(); datepicker = new ej.calendars.DatePicker({ width: "255px" }); datepicker.appendTo('#datepicker'); });