Click here to Skip to main content
15,868,164 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
i have list of user
using datatable i display .
having edit button in each row.
1st page popup modal open perfectly but after 2nd page it not open.

in pagination first 10 record butoon click popup open

after 2 page click (datatable) popup not work....when i click on edit but nothing happend.

What I have tried:

$(document).ready(function () {

       var datatable_documentskillmastertype = $('#data-table-skillmaster-type').DataTable(
       {
           "aoColumnDefs": [{
               bSortable: false,
               aTargets: [3, 4, 2]
           }],

       });




//data list in datatable
<!--DataTables example Row grouping-->
               <div id="row-grouping" class="section">
                   <div class="row">
                       <div class="col s12">
                           <table id="data-table-skillmaster-type" class="display" cellspacing="0">
                               <thead class="blue lighten-5">
                                   <tr>
                                       <th class="center-align">Sr. No</th>
                                       <th>Skill Name</th>
                                       <th>Description</th>
                                      <th class="center-align">Action</th>
                                   </tr>
                               </thead>
                               <tbody>
                                   @if (Model != null)
                                   {
                                       int i = 1;
                                       foreach (var item in Model)
                                       {
                                           <tr>
                                               <td class="center-align">@i </td>
                                               <td>@item.SkillName</td>
                                               <td>@item.SkillDiscription</td>
                                             <td class="center-align">
                                                   @*<button class="btn btn-danger btn-circle" type="button" onclick="GetSelectedQuote(@item.QuoteId);" data-toggle="modal" data-backdrop="static" data-keyboard="false"> class="fa fa-edit"></button>*@
                                                   <a href="#task-modal" title="Modify Skill" onclick="GetSelectedSkill(@item.SkillId);" class="btn-floating waves-effect waves-light darken-2   grid-btn-bg  modal-trigger">^__i class="mdi-editor-mode-edit"></a>
                                               </td>
                                           </tr>
                                                               i++;
                                                           }
                                                       }
                               </tbody>
                           </table>
                       </div>
                   </div>
               </div>
               <!-- End Dtatable-->






<!--start modalPopup-->
      <div id="task-modal" class="modal">
          <nav class="task-modal-nav cyne">
              <div class="nav-wrapper">
                  <div class="left col s12 m5 l5">
                      <ul>
                          <li>
                              <a href="#!" class="todo-add">Skill Type</a>
                          </li>

                      </ul>
                  </div>
                  <div class="right col s12 m5 l5">
                      <ul>
                          <li>
                              <a href="#!" class="todo-menu" onclick="ClearModel();">class="modal-action modal-close  mdi-navigation-close"></a>
                          </li>

                      </ul>

                  </div>
              </div>
          </nav>
          <div class="modal-content">
              @using (Html.BeginForm("SkillAdd", "SystemPreferences", FormMethod.Post, new { @id = "frmskill", @class = "col s12 right-alert" }))
              {
                  <div class="row" id="clearbody">
                      @Html.Partial("_AddSkill", new Utility.Model.SkillMaster())
                  </div>

              }
          </div>
      </div>
      <!--end modalPopup-->
Posted
Updated 4-Apr-18 20:15pm
v4
Comments
Karthik_Mahalingam 6-Nov-17 5:32am    
what do you mean by after 2nd page it not open
not clear,
Use Improve question to add more info to the question.
Jaydeep Shah 6-Nov-17 8:56am    
i have list of record of data and button is end of each row (Edit).
in datatable first 10 row working perfectly .after click 2 page my modal popup not open .
Karthik_Mahalingam 6-Nov-17 9:22am    
you wil have to rebind the modal events to the newly created rows.
post the relevant code
Jaydeep Shah 7-Nov-17 0:01am    
Hi @karthik i update my code.

list data have last td tag where popup open code ...

Karthik_Mahalingam 7-Nov-17 1:51am    
this line for modal ?
<a href="#task-modal" title="Modify Skill" class="btn-floating waves-effect waves-light darken-2   grid-btn-bg  modal-trigger"></a>

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900