Ajax.ActionLink() Renders Partial View Scripts But JavaScript code does not

Question

I am using Kendo Grid in my MVC application. The Grid has a Command column which contains a custom button for Details that Calls a Javascript function that sends an ajax request to server to get a partial view to replace the #AjaxDiv innerHtml like below :

    function BrandDetailView(e) {
    var dataItem = this.dataItem($(e.target).closest("tr"));
    var brandID = dataItem.PKBrand;

    var xmlhttp;
    xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function () {

        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("AjaxDiv").innerHTML = xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET", "/Brand/Details/" + brandID, true);
    xmlhttp.send()
}

the Detail partial view contains Kendo DropDownList that generates scripts inside its containing div . If I send a request to server Like above these scripts wont work, but if I create a Ajax.ActionLink() like below, they will work.

@Ajax.ActionLink("Detail", "Details", new { id = 2 }, new AjaxOptions() 
{
    UpdateTargetId="AjaxDiv",
    HttpMethod="GET",
    InsertionMode=InsertionMode.Replace 
})

I am stuck with the Detail button on the Grid, any solutions how to render scripts that way?

@MattBodily No there is no scripts on partial view, kendo dropdownlist adds some script to its containing div. — Gp17, Sep 19 '15 at 15:37

score 1 · Accepted Answer · edited May 23 '17 at 12:15

1

If there's a script in the content you add to your page via innerHTML, it is not going to execute, one possible solution would be to derive these script tags and add them again via Javascript to your page so that they execute this time.

Please refer to: https://stackoverflow.com/a/20584396/1821461

edited May 23 '17 at 12:15

Community

1
1

answered Sep 24 '15 at 07:08

Silverfox

136
1
9

Ajax.ActionLink() Renders Partial View Scripts But JavaScript code does not

1 Answers1