Why is not the dropdownlist rendered in a partialview?

[Juan Cruz]

|I'm trying to create a form with a dropdownlist in a partial view, but when I run my application, only one textbox appears. I did tests with a grid, with a button and with a dialog and there is no problem.

here is my code

@(

                    Html.EJS().DropDownList("Album")

                    .DataSource(dataManager => dataManager.Url(Url.Action("Albums", "JS2", null, Request.Url.Scheme)).Adaptor("UrlAdaptor").CrossDomain(true))

                    .Placeholder("Selecciona")

                    .PopupHeight("200px")

                    .Fields(new Syncfusion.EJ2.DropDowns.DropDownListFieldSettings

                    {

                        Value = "AlbumId",

                        Text = "Titulo"/*, Id="AlbumId"*/

                    })

                    .ActionComplete("complete").ActionFailure("fail").Change("onSelect")

                    .Render()

    )

public ActionResult GetArtista(Syncfusion.EJ2.Base.DataManagerRequest dm)

        {

            var data = read.GetArtistas();

            return Json(data);

        }

I have another question: Can @Ajax.BeginForm be used with Syncfusion controls?

I hope you can help me. I thank you very much

[Prince Oliver]

Hi Juan, 

Thank you for contacting Syncfusion support. 

Query 1: I'm trying to create a form with a dropdownlist in a partial view, but when I run my application, only one textbox appears. 

We have checked your scenario and shared code snippet. We suspect that you might have missed to bind events to the DropDownList component but have initialized your script. This could have caused script error in the application and the control is not rendered. Kindly ensure whether all the events have their respective JavaScript handler functions. 

@( 

    Html.EJS().DropDownList("Album") 

    .DataSource(dataManager => dataManager.Url(Url.Action("Albums", "JS2", null, Request.Url.Scheme)).Adaptor("UrlAdaptor").CrossDomain(true)) 

    .Placeholder("Selecciona") 

    .PopupHeight("200px") 

    .Fields(new Syncfusion.EJ2.DropDowns.DropDownListFieldSettings 

    { 

        Value = "AlbumId", 

        Text = "Titulo"/*, Id="AlbumId"*/ 

    }) 

    .ActionComplete("complete").ActionFailure("fail").Change("onSelect") 

    .Render() 

) 

 

 Also, please add “@Html.EJS().ScriptManager()”  at the end of the partial view page. We have prepared sample based on your scenario. Kindly refer to the following code snippet. 

[main page] 

<div class="col-lg-12 control-section" style="margin: 50px"> 

    <div id="wrapper"> 

    </div> 

</div> 

<button id="datebutton" text="Click" onclick="onClick()"> click Partial view </button> 

<script type="text/javascript"> 

    function onClick() { 

        var ajax = new ej.base.Ajax('/Home/PartialView1/?Person2', 'GET', true); 

        ajax.send().then(); 

        ajax.onSuccess = function (data) { 

            $("#wrapper").html(data); 

        } 

    } 

</script> 

 

[partial view page] 

<div id="Myfrom" style="width:300px"> 

 

@(Html.EJS().DropDownList("Album").DataSource((IEnumerable<object>)ViewBag.data) 

 

    .Placeholder("Selecciona").PopupHeight("200px").Render() 

 

) 

 

@Html.EJS().ScriptManager() 

 

We have attached a sample for your reference, please find the sample at the following location. 

Sample Link: http://www.syncfusion.com/downloads/support/directtrac/143182/ze/WebApplication1-1985403812  

Query 2: Can @Ajax.BeginForm be used with Syncfusion controls? 

Yes, you can use Ajax.BeginForm with Syncfusion controls. 

Please let us know if you need any further assistance on this. 

Regards, 

Prince 

[Juan Cruz]

I appreciate that you have answered my two questions. I would like to know if you can put Syncfusion controls (like dropdownlist, datepicker, etc) into a dialog control to create a form

[Prince Oliver]

Hi Juan, 

 

Thank you for your update. 

 

Yes, you can put Syncfusion controls (like dropdownlist, datepicker, etc) into a dialog control to create a form. We have prepared simple sample for Dialog component with partial page content. We have covered below things on the sample. 

 

• We have rendered Dialog component and hide on initial rendering using visible property.
• We have got partial view page content using ajax post and append into Dialog content element before open the dialog component using BeforeOpen event.

 

Please find the sample at the following location: http://www.syncfusion.com/downloads/support/directtrac/general/ze/WebApplication11173128402  

 

Kindly refer to the following links for further reference. 

 

API reference link for beforeOpen: https://ej2.syncfusion.com/documentation/api/dialog#beforeopen 

API reference link for visible: https://ej2.syncfusion.com/documentation/api/dialog/#visible  

Online Demo sample for loading AJAX content: https://ej2.syncfusion.com/aspnetmvc/Dialog/AjaxContent#/material  

 

Please let us know if you need any further assistance on this.  

 

Regards, 

Prince