Jquery.Load on view does not function with interior Partial views dropdownlist.

So I've got a bit of a pickle here, I am loading a partial view into a div using this code:

@if (Model.CompanyDashboard.CurrentDashboard != 0)
{
Html.RenderAction("CompanyDetails", "Dashboard", new { id = Model.CompanyDashboard.CurrentDashboard });
}


And it loads a view which has within it another html.renderaction, which loads another partial view which has this code in it (This is just a segment, but the rest is more of the same):



@Html.EJS().MultiSelect("EditTypeVisible").Value(Model.visibleTypes).DataSource(Model.allTypes).Placeholder("" +
"Set User Type Visibility.").Mode(VisualMode.CheckBox).ShowDropDownIcon(false).HideSelectedItem(false).ShowSelectAll(true).AllowFiltering(true).Filt erBarPlaceholder("Search " +
"roles").Fields(new MultiSelectFieldSettings { Text = "TypeDisplay", Value = "TypeID" }).Close("VisibleRolesClosed").Render()



@Html.EJS().MultiSelect("EditTypeHome").Value(Model.homeTypes).DataSource(Model.allTypes).Placeholder("" +
"Set User Type Home Page.").Mode(VisualMode.CheckBox).ShowDropDownIcon(false).HideSelectedItem(false).ShowSelectAll(true).AllowFiltering(true).FilterBarPlaceholder("Search " +
"roles").Fields(new MultiSelectFieldSettings { Text = "TypeDisplay", Value = "TypeID" }).Close("VisibleRolesClosed").Render()


Now that functions fine, and gives this as the final result:

This is exactly what I want, now I need to be able to dump everything in that result, and rerun the initial HTML render action, I do this through js calling this function:

$("#company_Dashboard").load("@Url.Action("CompanyDetails", "Dashboard")", { 'id': e.data.AssignedID.toString() }, function (response, status, xhr)
{
if (status == "error") {
alert("An error occurred while loading the results.");
}
});

Which works for the most part, everything works on the new partial view, except for the partial view within that partial view, it results in this:

Does anyone have any idea why this is happening?

Edit:
Update 1:

I pushed all the multiselect options to the primary partial view, it does not work there either, so it is something else, I have grids and charts working within this view, so I have no idea why multi select options are not working.

Update 2:

Ok I stand corrected, I forgot I had phased out usage of @html.ejs() elsewhere, these are the only ones, so it would seem across the board using Jquery.Load simply does not work with building menus in this fashion.


3 Replies 1 reply marked as answer

PM Ponmani Murugaiyan Syncfusion Team May 28, 2021 04:31 PM UTC

Hi David, 
 
Thanks for contacting Syncfusion support. 
 
Based on your provided information, we suspect that the reported issue is caused due to not importing the script manager in the partial view page. So, please refer the ejs-scriptmanager in the partial view page at the end of the page (where the Multiselect component is rendered ) as like the below. 
 
<ejs-scripts></ejs-scripts>  
 
Kindly check with the above suggestion. If issue still exists in your end, please revert us with the below details . 
 
  1. Share Nuget version used in your application.
  2. Whether facing any console error.
  3. If possible share issue replicating sample.
 
The above requested details will help us to check and provide you the solution at earliest. 
 
Regards, 
Ponmani M 


Marked as answer

DH David House May 29, 2021 05:56 PM UTC

Roger, so one of my co-workers had that same idea as well, putting this at the bottom of our partial view worked and solved the issue:


@Html.EJS().ScriptManager()

Thank you for your help.



PM Ponmani Murugaiyan Syncfusion Team May 31, 2021 03:21 AM UTC

Hi David, 

Most welcome. 

Regards, 
Ponmani M 


Loader.
Up arrow icon