0

I want to have an "add row" functionality in my asp.net mvc View. One way I can do it is have n hidden rows and unhide a row each time "add row" is clicked. But then how would I handle serial numbers (each row would have a serial number) when a row is deleted. I don't want to do it with JS. What would be the best approach. Should I do it from code behind? Any suggestions?

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
who-aditya-nawandar
  • 1,334
  • 9
  • 39
  • 89
  • 2
    Hate to break it to you but the only clean and sane way is to have JavaScript assist you in this. You will need to suck it up and learn that discipline if you planning for a career in web development. Otherwise ask your frontend'er to do this part. –  Feb 11 '17 at 16:54
  • I can do it with JS, but I have read and heard its not the right approach. It causes issues. – who-aditya-nawandar Feb 11 '17 at 16:57
  • where did you hear it is not the right approach ? What are the issues ? To make your UI dynamic (no post back for the delete), you should use javascript. Not sure why people don't like javascript ! – Shyju Feb 11 '17 at 16:58
  • @stylojack_10 not sure where you picked up that guidance, they offer no alternative in their guidance? –  Feb 11 '17 at 16:58
  • how will you unhide the rows without javascript? –  Feb 11 '17 at 16:59
  • For unhiding, it will be minimal JS, like css change. But building and rendering the entire HTML in JS, I don't know if that's right. And I like JS, btw. – who-aditya-nawandar Feb 11 '17 at 17:04
  • In addition to the dupe, refer [this answer](http://stackoverflow.com/questions/40539321/a-partial-view-passing-a-collection-using-the-html-begincollectionitem-helper/40541892#40541892) for a more complete example using `BeginCollectionItem` –  Feb 11 '17 at 22:33

2 Answers2

1

I am not sure why you do not want to do it with javascript and everything on the client side. It would be a better experience for the user and it would be quicker.

However, since you specifically indicated you want to do it in code behind then do this. Create a partial view and put the required html for a new row into it. Then you need to call your controller to serve that html to you from the client side. You can do that using AJAX. Here is how with jQuery:

$.ajax({
    type: "GET",
    url: "/Home/GetSomePartialView/",
    data: someArguments,
    success: function (viewHTML) { 
    $("#someDiv").html(viewHTML); 
 },
    error: function (errorData) { onError(errorData); }
});

The above will get the html and inject it into an element with ID someDiv.

You will need an action in controller to serve the html. Here is some code:

public Action result GetSomePartialView(SomeArgumentModel someArguments)
{

    return PartialView("_NewRow");
}
CodingYoshi
  • 25,467
  • 4
  • 62
  • 64
  • 2
    JQuery is javascript and there is no such thing as Ajax without javascript. –  Feb 11 '17 at 17:01
  • Yes but i never said any of the above. In total agreement with you. – CodingYoshi Feb 11 '17 at 17:04
  • I need Ajax for showing a row??!! Its just in the UI. – who-aditya-nawandar Feb 11 '17 at 17:06
  • 1
    Not sure why someone is so curious to downvote this; I know OP is looking for implementation without JS, but from what I understood, OP doesn't want to do too much html manipulation in JS side. I would go with this approach were you do an ajax to get the partial view html and then append it to the container. Or I would go for knickoutJs which blends beautifully with mvc – Developer Feb 11 '17 at 17:27
  • @Dveloper This is exactly what I figured from the op's question that the OP does not want to create rows on the client side but is willing to use js for other parts of it – CodingYoshi Feb 11 '17 at 18:10
0

Call a webmethod using Ajax that calls the delete SQL for you and rebinds the grid with the new results in JS.

Nothing
  • 99
  • 12