locked
repeater ajax edit lightbox RRS feed

  • Question

  • User-369408486 posted

    hi

    i have a repeater full of data..now on a edit button click the whole data will come into a lightbox and then by json i have to updatye it...kindly can any onehelp me to sort it how..how to do that...i did the part to update it...but from repeater how to get the data to a lightbox

    Friday, December 27, 2013 2:29 AM

Answers

  • User-417640953 posted

    Hi arkadeepde,

    Thank you post the issue to asp.net forum.

    From your description, I see that you want to popup a lightbox with the data which wanted to be edit.

    For this issue, i suggest you using the jquery lightbox_me to to pop up the div content. I made a demo below.

    aspx:

    <head runat="server">
        <title></title>
        <script src="../../Scripts/jquery-1.7.1.js"></script>
        <script src="../../Scripts/buckwilson-Lightbox_me-8ff1a2b/jquery.lightbox_me.js"></script>
        <script>
            $(function () {
                $('.EditBt').click(function (e) {
                    var bt = $(this);
                    $('#sign_up').lightbox_me({
                        centered: true,
                        onLoad: function () {
                           
                            // alert(bt.closest("tr").find(".nameTd").html())
                            $('#sign_up').find('input').eq(0).val(bt.closest("tr").find(".nameTd").html());
                            $('#sign_up').find('input').eq(1).val(bt.closest("tr").find(".priceTd").html());
                            $('#sign_up').find('input:first').focus();
                        }
                    });
                    e.preventDefault();
                });
            }) 
        </script> 
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
             <asp:Repeater ID="Repeater1" runat="server">
                 <HeaderTemplate>
                     <table border="1">
                         <tr>
                            <td>Name</td>
                            <td>Price</td>
                            <td>Edit</td>
                         </tr>
                 </HeaderTemplate>
                 <ItemTemplate>
                        <tr>
                            <td class="nameTd"><%#Eval("Name") %></td>
                            <td class="priceTd"><%#Eval("Price") %></td>
                            <td> <input id="Button1" type="button" value="Edit" class="EditBt" /></td>
                         </tr>
                 </ItemTemplate>
                 <FooterTemplate>
                     </table>
                 </FooterTemplate>
             </asp:Repeater>
             <div id="sign_up" style="display:none;  border:solid 2px white;">
                    <table>
                        <tr>
                            <td>Name:</td>
                            <td><input id="Text1" type="text" /></td>
                        </tr>
                         <tr>
                            <td>Price:</td>
                            <td><input id="Text2" type="text" /></td>
                        </tr>
                        <tr>
                            <td> <a id="Submit" class="yourclass" href="#">Submit</a></td>
                            <td><a id="close_x" class="close sprited" href="#">close</a></td>
                        </tr>
                    </table> 
              </div> 
        </div>
        </form>
    </body>

    Code Behind:

      protected void Page_Load(object sender, EventArgs e)
            {
                //test data
                System.Data.DataTable dt = new System.Data.DataTable();
                dt.Columns.Add("Name");
                dt.Columns.Add("Price");
                dt.Rows.Add("Jhon",12);
                dt.Rows.Add("Tome", 32);
                this.Repeater1.DataSource = dt;
                this.Repeater1.DataBind();
            }

    For how to use the jquery lightbox_me, please refer to below link.

    http://buckwilson.me/lightboxme/

    Thanks.

    Best Regards!

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Sunday, December 29, 2013 10:25 PM