2016-08-09 42 views
1

So habe ich Modal mit Teilansicht, wo ist geschachtelt WebGrid (wo ist die Liste der Optionen Benutzer wählen können) und BeginForm (wo ausgewählte Werte gesetzt und Post gemacht wird). Ich hatte ein Problem, das mein modales Fenster wurde nach Paging zu schließen, so weiter und so war ich gesagt, mein Code auf diese Weise zu schreiben ->Skripte funktionieren nicht mehr nach dem Paging WebGrid

PartailView (modal):

@model BTGHRM.Models.HarmingFactorsModel 

@{ 
    var db = new HRMEntities(); 
    WebGrid grid = new WebGrid(db.CatalogHarmingFactors, canPage: true, canSort: false, rowsPerPage: 5, ajaxUpdateContainerId: "deploymentsGrid1"); 
} 


<div id="deploymentsGrid1"> 
    @if (db.CatalogHarmingFactors.Any()) 
    { 
     @grid.GetHtml(
     tableStyle: "table", 
     headerStyle: "table_HeaderStyle", 
     footerStyle: "table_PagerStyle", 
     rowStyle: "table_RowStyle", 
     alternatingRowStyle: "table_AlternatingRowStyle", 
     selectedRowStyle: "table_SelectedRowStyle", 
     columns: grid.Columns(

      grid.Column("Nr", @Resources.Localization.nr, format: @<text> 
       @item.Nr 
      </text>, style: "p20"), 

      grid.Column("Description", @Resources.Localization.description, format: @<text> 
       @item.Description 
      </text>, style: "p70"), 


      grid.Column("", "", format: @<text>    
       <input id="select_bttnn" class="select_bttn" style="width:78px" type="button" [email protected] data-nr="@item.Nr" data-description="@item.Description" /> 
      </text>) 
       ) 
      ) 
          } 
</div> 

<br /> 

<div class="container"> 

    @using (Html.BeginForm("AddHarmingFactorToList", "Health", FormMethod.Post)) 
    { 
     @Html.HiddenFor(m => m.EmployeeId) 

     @Html.TextBoxFor(m => m.Nr, Model.Nr, new { style = "width:20%", id = "Number1" }) 
     @Html.TextBoxFor(m => m.Description, Model.Description, new { style = "width:70%", id = "Desc1" }) 
     <br /> 
      <br /> 
       @Html.LabelFor(m => m.Start_date) 
       @Html.TextBoxFor(m => m.Start_date, new { id = "datepicker", style = "width:25%" }) 
       @Html.LabelFor(m => m.End_date) 
       @Html.TextBoxFor(m => m.End_date, new { id = "datepicker2", style = "width:25%" }) 

       <br /><br /> 
       <input type="submit" value="@Resources.Localization.save" style="width:78px" /> 
    } 
    <button id="closer">@Resources.Localization.back</button> 
</div> 

und Methode:

public PartialViewResult _GetHarmingFactorPartial() 
    { 
     int userId = GetUserId("s"); 
     BTGHRM.Models.HarmingFactorsModel newHarmingFactor = new BTGHRM.Models.HarmingFactorsModel(); 
     newHarmingFactor.EmployeeId = userId; 
     return PartialView("Partial/_HarmingFactorPopUp", newHarmingFactor); 
    } 

, die in Hauptansicht wie genannt:

@Html.Action("_GetHarmingFactorPartial", "Health") 

Jetzt Paging schließt nicht die ganze modal und Benutzer c Das Lecken des Knopfes setzt die Werte auf startForm Felder, genau wie geplant. Aber bei einem Seiten-Skript, das in meiner Hauptansicht verschachtelt ist, hört die Arbeit auf, und sellet_button tut nichts, weil ich beim Paging neues HTML in mein Modal bekomme. Ich habe versucht, mein Skript an jedem einzelnen Platz zu platzieren, aber es beginnt nicht zu arbeiten, egal ob es in meiner Teilansicht in Abschnitts-Skripten oder am Anfang der Seite ist.

So, hier ist das Skript:

<script type="text/javascript"> 
    $(function() { 
     $("#dialog").dialog({ 
      autoOpen: false, 
      height: 400, 
      width: 600, 
      scrollable: false, 
      show: { 
       effect: "blind", 
       duration: 1000 
      } 
     }); 
    }); 

    $(function() { 
     $(".select_bttn").click(function() { 
      var nr = $(this).data('nr'); 
      var description = $(this).data('description'); 

      $("#Number").val(nr); 
      $("#Desc").val(description); 
     }); 
    }); 
</script> 

Wie könnte ich dieses Problem beheben?

Antwort

2

die Click-Ereignis Logik für Ihre Schaltfläche Ersetzen unten mit dem Code:

$("body").on('click', '.select_bttn', function() { 
    alert("Click fired"); 
    var nr = $(this).data('nr'); 
    var description = $(this).data('description'); 

    $("#Number").val(nr); 
    $("#Desc").val(description); 
});