CODEWITHSUNDEEP
htmlasp.net-mvcjqueryappend
Dylan Slabbinck
Dylan Slabbinck

Reputation: 854

Jquery .append() & Html.Helper

Is there any way to put html.helper inside a .append() function.

success: function (html) { $("#Resultaatsgebied").append(' <li>@Html.TextBoxFor(item => Model.RG1)<ul id="Concretisering" class="subList"><li>@Html.TextBoxFor(item => Model.RG1sub1)</li></ul>@Html.ActionLink("+", "index", null, new { id = "addConcretisering" })</li>'); }

This works, but just as a string, not as a control

EDIT:

This works now, but the actionlink who is generated does not. I have the same actionlink default in my view, and there it works. But for the generated one, I think he just does not execute the ajax call?

Upvotes: 4

Views: 8210

Answers (4)

Kalana
Kalana

Reputation: 6173

In MVC 5 razor or newest versions, This quota --> ' not working anymore. Therefore, use ( ` ) mark to do your work

success: function (html) {     
   $("#Resultaatsgebied").append(` 
      <li>@Html.TextBoxFor(item => Model.RG1)    
           <ul id="Concretisering" class="subList">     
                <li>@Html.TextBoxFor(item => Model.RG1sub1)</li>   
           </ul>      
           @Html.ActionLink("+", "index", null, new { id = "addConcretisering" })    
      </li>
  `);    
}

Upvotes: 1

Samuel Caillerie
Samuel Caillerie

Reputation: 8275

If your code is in a razor view, you can put into brackets your razor code like this :

success: function (html) { 
    $("#Resultaatsgebied").append(' <li>@(Html.TextBoxFor(item => Model.RG1))<ul id="Concretisering" class="subList"><li>@(Html.TextBoxFor(item => Model.RG1sub1))</li></ul>@(Html.ActionLink("+", "index", null, new { id = "addConcretisering" }))</li>'); 
}

Upvotes: 1

Jai
Jai

Reputation: 74748

May be a better concatenation like this (not sure but you can try):

success: function (html) { 
    $("#Resultaatsgebied").append(
          '<li>' + @Html.TextBoxFor(item => Model.RG1) + 
          '<ul id="Concretisering" class="subList"><li>' + 
             @Html.TextBoxFor(item => Model.RG1sub1) + 
          '</li></ul>' + 
             @Html.ActionLink("+", "index", null, new { id = "addConcretisering" }) + 
          '</li>'); 
}

Upvotes: 0

The Lazy Log
The Lazy Log

Reputation: 3574

I think you can not do that in pure Javascript. Why don't you set the returned data from AJAX as HTML and you can set it for any div you want. For example in your case:

$("#Resultaatsgebied").html(html);

Upvotes: 0

Related Questions