4
Answers

problem load Details View in bootstrp modal popup

Aktham Mahmoud

Aktham Mahmoud
4y
925
1
Greeting all
 
I review many samples to implement Bootstrap Modal popup to load Details View.
 
Scenario:
 
I have a grideview get staff rows from table. when an admin need to edit employee row, I click on Edit botton in grideview and returun a data to details view, depends on (GridViewEmplyee_SelectedIndexChanged) Method.
Everything going well in normal mode ( DetilsView in same page). As Fig.(1) below:
 
 
 
Problem:
 
Bootstrap Modal popup can't to load Details View.As Fig.(2) below
 
 
 
Front end code:
(Botoon in GridView)
  1. <asp:LinkButton ID="LinkButton2" runat="server" CommandName="Select" href="#myModal" data-toggle="modal">Edit</asp:LinkButton>  
Front end code:
(DetailsView in Bootstrap Modal popup ):
  1. <div id="myModal" class="modal fade">  
  2. <div class="modal-dialog">  
  3. <div class="modal-content">  
  4. <div class="modal-header">  
  5. <h4 class="modal-title">Edit selected emplyee</h4>  
  6. </div>  
  7. <div class="modal-body" style="overflow-y: scroll;max-height:100%; margin-top: 10px; margin-bottom: 10px;">  
  8. <asp:Label ID="lblmessage" runat="server" ClientIDMode="Static"></asp:Label>  
  9. <asp:DetailsView ID="DetailsView1" runat="server" DataSourceID="Sds_2" Visible="False" AutoGenerateRows="False" DataKeyNames="Id">  
  10. <Fields>  
  11. <asp:BoundField DataField="Id" HeaderText="Id" InsertVisible="False" ReadOnly="True" SortExpression="Id" Visible="false" />  
  12. <asp:BoundField DataField="S_Name" HeaderText="S_Name" SortExpression="S_Name" />  
  13. <asp:BoundField DataField="S_Lname" HeaderText="S_Lname" SortExpression="S_Lname" />  
  14. <asp:BoundField DataField="S_Gender" HeaderText="S_Gender" SortExpression="S_Gender" />  
  15. <asp:BoundField DataField="S_Salary" HeaderText="S_Salary" SortExpression="S_Salary" />  
  16. <asp:BoundField DataField="S_Phone" HeaderText="S_Phone" SortExpression="S_Phone" />  
  17. <asp:BoundField DataField="pos_CodeID" HeaderText="pos_CodeID" SortExpression="pos_CodeID" />  
  18. <asp:BoundField DataField="Br_CodeID" HeaderText="Br_CodeID" SortExpression="Br_CodeID" />  
  19. <asp:BoundField DataField="S_photo" HeaderText="S_photo" SortExpression="S_photo" />  
  20. <asp:BoundField DataField="S_Date" DataFormatString="{0:d}" HeaderText="S_Date" SortExpression="S_Date" />  
  21. <asp:BoundField DataField="F_Date" DataFormatString="{0:d}" HeaderText="F_Date" SortExpression="F_Date" />  
  22. <asp:BoundField DataField="Last_Branch" HeaderText="Last_Branch" SortExpression="Last_Branch" />  
  23. <asp:BoundField DataField="Last_Mission" HeaderText="Last_Mission" SortExpression="Last_Mission" />  
  24. <asp:CheckBoxField DataField="S_Status" HeaderText="S_Status" SortExpression="S_Status" />  
  25. </Fields>  
  26. </asp:DetailsView>  
  27. <asp:SqlDataSource ID="Sds_2" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>"  
  28. SelectCommand="SELECT * FROM [Staff] WHERE ([Id] = @Id)"  
  29. UpdateCommand="UPDATE Staff SET S_Name = @S_Name, S_Lname = @S_Lname, S_Gender = @S_Gender, S_Salary = @S_Salary, pos_CodeID = @pos_CodeID, Br_CodeID = @Br_CodeID, S_Phone = @S_Phone, S_Date = @S_Date, F_Date = @F_Date, Last_Branch = @Last_Branch, Last_Mission = @Last_Mission, S_Status = @S_Status">  
  30. <SelectParameters>  
  31. <asp:ControlParameter ControlID="GridViewEmplyee" Name="Id" PropertyName="SelectedValue" Type="Int32" />  
  32. </SelectParameters>  
  33. <UpdateParameters>  
  34. <asp:Parameter Name="S_Name" />  
  35. <asp:Parameter Name="S_Lname" />  
  36. <asp:Parameter Name="S_Gender" />  
  37. <asp:Parameter Name="S_Salary" />  
  38. <asp:Parameter Name="pos_CodeID" />  
  39. <asp:Parameter Name="Br_CodeID" />  
  40. <asp:Parameter Name="S_Phone" />  
  41. <asp:Parameter Name="S_Date" />  
  42. <asp:Parameter Name="F_Date" />  
  43. <asp:Parameter Name="Last_Branch" />  
  44. <asp:Parameter Name="Last_Mission" />  
  45. <asp:Parameter Name="S_Status" />  
  46. </UpdateParameters>  
  47. </asp:SqlDataSource>  
  48. </div>  
  49. <div class="modal-footer">  
  50. <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>  
  51. </div>  
  52. </div>  
  53. </div>  
  54. </div>  
Another solutions:
 
I used update panel with detailsView (Trigger event) not working.
 
So another solution can anyone help me with that?
Thanks
Answers (4)
Next Recommended Forum