locked
how to use remove and map function to loop to index and remove indices RRS feed

  • Question

  • User1601964810 posted

    what i need actually replace hide function by remove function and map to remove indices

    I have html table have list of course as following

    c#

    asp.net

    html

    when remove asp.net by jquery it remove also html

    if i remove html it is working success

    if i remove c# it not working

    so that when using remove function to remove first course or any course in center it make problem 

    in index so that i need to loop throw indexes using map to remove indices 

    how to do that 

    my code as following

    1. @model WebCourse.Models.Cusomemp2
      @{
          Layout = null;
      }
      
      <!DOCTYPE html>
      
      <html>
      <head>
          <meta name="viewport" content="width=device-width" />
          <title>Edit</title>
          <script src="~/scripts/jquery-1.10.2.js"></script>
          <script>
              $(function () {
                
                  var index = 0;
                  $("#CourseId").change(function () {
      
                      var id = $(this).val();
                      var txt = $("#CourseId option:selected").text();
                      $("#tb").append("<tr><td><input type = 'hidden' name='empcourses[" + index + "].CourseId' value='" + id + "'/></td><td>" + txt + "</td><td><input type='button' value='remove' class='r'</td></tr>")
      
                      index++;
                  });
                  $("#tb").on("click", ".r", function () {
                      $(this).parent().parent().hide();
                      $(this).parent().prev().prev().find("input").val("0");
                  });
                  $.ajax({
                      url: "/Employee/getcoursesbyempid",
                      data:{x:$("#hid").val()},
                      success: function (res) {
                          $.each(res, function (i, e) {
                              $("#tb").append("<tr><td><input type = 'hidden' name='empcourses[" + index + "].CourseId' value='" + e.Id + "'/></td><td>" + e.CourseName + "</td><td><input type='button' value='remove' class='r'</td></tr>")
      
                              index++;
                          });
                      }
                      
                  })
              });
          </script>
      </head>
      <body>
          <div>
              @using (Html.BeginForm())
              {
                  <div>
                      <input type="hidden" value="@ViewBag.hid" id="hid" />
                      Courses:@Html.DropDownList("CourseId")
                      <br />
                      <table id="tb"></table>
                      <input type="submit" value="save" />
      
                  </div>
      
              }
          </div>
      </body>
      </html>
    Friday, September 16, 2016 7:07 PM

All replies

  • User2117486576 posted

    Try:

    $("#tb").on("click", ".r", function () {
                    var row = $(this).closest("tr");
                    row.find("input[name^=empcourses]").val("0"); 
                    row.hide(); 
    });

    Friday, September 16, 2016 10:15 PM
  • User1601964810 posted

    hide not solve the problem i test it

    but it not work for me

    Friday, September 16, 2016 10:29 PM
  • User-1142886626 posted

    Hi ahmed.barbary,

    what i need actually replace hide function by remove function and map to remove indices

    when remove asp.net by jquery it remove also html

    if i remove html it is working success

    if i remove c# it not working

    According to your description, I had written a test demo on my computer, it works well.

    Could you please describe more about your problem/issue? Such as post screenshots, it will help us analyze and diagnose this issue more clearly. 

    More details about my test demo, you could refer to follow codes and image:

    <script type="text/javascript">
            $(function () {
                var index = 0;
                $("#CourseId").change(function () {
                    var id = $(this).val();
                    var txt = $("#CourseId option:selected").text();
                    $("#tb").append("<tr><td><input type = 'hidden' name='empcourses[" + index + "].CourseId' value='" + id + "'/></td><td>" + txt + "</td><td><input type='button' value='remove' class='r'</td></tr>")
                    index++;
                });
                $("#tb").on("click", ".r", function () {
                    $(this).parent().parent().remove();
                    $(this).parent().prev().prev().find("input").val("0");
                });
            });
    
      </script>
    

    Screen shoot:

    Best regards,

    Ailleen

    Friday, September 30, 2016 6:24 AM