locked
How to get column value when Radio is checked by using JQuery RRS feed

  • Question

  • User-582711651 posted

    Hi, I want to get following column values when Radio checked=true from Repeater 

    Column values  tdCustomerCodetdCustomerName 

    And values will be stored into label controls ... lbl_CustomerCode and lbl_CustomerName 

    This is my repeater
    
    <asp:Panel ID="Pnl_Reptr" runat="server" ScrollBars="Auto" Height="200px">
                                    <div class="box-body">
                                    <div class="row" style="padding: 10px;" id="Gridpanel" runat="server">
                                        <div class="row">
                                            <div class="row table-responsive" id="pnl_Repeater" runat="server" visible="True">
                                                <asp:Repeater runat="server" ID="rptLeadGrid">
                                                    <HeaderTemplate>
                                                        <table id="tblAttendance" class="table table-bordered table-striped" style="cursor: pointer; margin-bottom: 0px;">
                                                            <tr style="background: #3c8dbc; color: #fff; font-size: 16px;">
                                                                <th>Insurance Claim Transaction Details</th>
                                                            </tr>
                                                        </table>
                                                        <div class="table-responsive" style="background-color: #e2e2e2; padding-top: 5px;">
                                                            <div class="box-body">
                                                                <table id="example1" class="table table-bordered table-hover" style="cursor: pointer; background-color: #fff;">
                                                                    <thead style="background-color: #3c8dbc; color: #fff; font-size: 14px; border: none;">
                                                                        <tr>
                                                                            <th id="thSN" runat="server">Sr#</th>
                                                                            <th id="thchk" runat="server">+</th>
                                                                            <th id="tdTrackingNo" runat="server">Tracking#</th>
                                                                            <th id="thDocuStatus" runat="server">Status</th>
                                                                            <th id="thRegion" runat="server">Region Name</th>
                                                                            <th id="thBranch" runat="server">Branch Name</th>
                                                                            <th id="thGroupName" runat="server">Group Name</th>
                                                                            <th id="thCustomerCode" runat="server">MemberCode</th>
                                                                            <th id="thCustomerID" runat="server">MemberID</th>
                                                                            <th id="thCustomerName" runat="server">Member Name</th>
                                                                            <th id="thLoanID" runat="server">LoanID</th>
                                                                            <th id="thDeadType" runat="server">DeadType</th>
                                                                            <th id="thDeadPerson" runat="server">Dead Person</th>
                                                                            <th id="thDeathCause" runat="server">DeathCause</th>
                                                                            <th id="thDeathDate" runat="server">DeathDate</th>
                                                                            <th id="thCourierName" runat="server">CourierName</th>
                                                                            <th id="thPODNo" runat="server">POD No</th>
                                                                            <th id="thSubmittedby" runat="server">SentBy</th>
                                                                            <th id="thMobNo" runat="server">MobNo</th>
                                                                            <th id="thDocStat" runat="server" visible="false">.</th>
                                                                            <th id="thRowID" runat="server" visible="false">.</th>
                                                                            </tr>
                                                                    </thead>
                                                                    <tbody>
                                                    </HeaderTemplate>
                                                    <ItemTemplate>
                                                        <tr style="font-size: 12px;">
                                                           <td id="tdSN" runat="server"><%#Container.ItemIndex + 1 %></td>
                                                            <td id="tdchk" runat="server">
                                                                <asp:RadioButton ID="rbt_row" runat="server" CssClass="btn btn-success" type="radio" onclick="fnCheckUnCheck(this.id); Pop_HOApprvl();"/></td>
                                                            <td id="tdTrackingNo" runat="server" style="color: #003399">
                                                                <asp:Label ID="lbl_trackno" runat="server" Text='<%#Eval("TrackingNo") %>'></asp:Label></td>
                                                            <td id="tdDocuStatus" runat="server" style="color: #CC3300"><%#Eval("DocuStatus") %></td>
                                                            <td id="tdRegionName" runat="server"><%#Eval("RegionName") %></td>
                                                            <td id="tdBranchName" runat="server"><%#Eval("BranchName") %></td>
                                                            <td id="tdGroupName" runat="server"><%#Eval("Group") %></td>
                                                            <td id="tdCustomerCode" runat="server"><%#Eval("MEMBERCODE") %></td>
                                                            <td id="tdCustomerID" runat="server"><%#Eval("MEMBERID") %></td>
                                                            <td id="tdCustomerName" runat="server"><%#Eval("MEMBERNAME") %></td>
                                                            <td id="tdLoanID" runat="server"><%#Eval("LoanID") %></td>
                                                            <td id="thDeadType" runat="server"><%#Eval("DeadType") %></td>
                                                            <td id="thDeadPerson" runat="server"><%#Eval("DeadPerson") %></td>
                                                            <td id="tdDeathCause" runat="server"><%#Eval("DeathCause") %></td>
                                                            <td id="tdDeathdate" runat="server"><%#Eval("DateofDead") %></td>
                                                            <td id="tdCourierName" runat="server"><%#Eval("CourierName") %></td>
                                                            <td id="tdPODNo" runat="server"><%#Eval("PODNo") %></td>
                                                            <td id="tdSentBy" runat="server"><%#Eval("SentBy") %></td>
                                                            <td id="tdMobNo" runat="server"><%#Eval("MobNo") %></td>
                                                            <td id="tdDocStat" runat="server">
                                                                <asp:Label ID="DStat" runat="server" Text='<%#Eval("DocStat") %>' Visible="false"></asp:Label></td>
                                                            <td id="tdRowID" runat="server">
                                                                <asp:Label ID="RowID" runat="server" Text='<%#Eval("RowID") %>' Visible="false"></asp:Label></td>
                                                            
                                                        </tr>
                                                    </ItemTemplate>
                                                    <FooterTemplate>
                                                        </tbody></table> 
                                            </div>
                                            </div>  
                                                    </FooterTemplate>
                                                </asp:Repeater>
                                            </div>
                                            <center>
                                            <asp:Label ID="Label1" runat="server" Text="" ForeColor="red"></asp:Label>
                                            <asp:Label ID="lbl_trckingid" runat="server" Text="" ></asp:Label>
                                            </center>   
                                        </div>
                                    </div>
                                </div>
                                </asp:Panel>

    Supporting scripts

    <script type="text/javascript">
            function fnCheckUnCheck(objId) {
    
                var rdoArray = document.getElementsByTagName("input");
                for (i = 0; i <= rdoArray.length - 1; i++) {
                    if (rdoArray[i].type == 'radio') {
                    
                        if (rdoArray[i].id != objId) {
                            rdoArray[i].checked = false;
                        }
                    }
                }
            }
        </script>
    
     <script type="text/javascript">
     function Pop_HOApprvl() {
                $(".modal-backdrop").remove();
                $("#Popu_HOApproval").modal('show');
             } 
    </script>

    Thanks in advance. 

    Sunday, October 4, 2020 3:20 PM

Answers

  • User-939850651 posted

    Hi ayyappen.CNN,

    According to your description, I tried using the code you provided. I modified some of the code to achieve your requirements. You could try the .children jQuery function.

    A simple example:

    <head runat="server">
        <title></title>
        <script src="Scripts/jquery-3.5.1.min.js"></script>
        <script type="text/javascript">
            function fnCheckUnCheck(objId) {
    
                var rdoArray = document.getElementsByTagName("input");
                for (i = 0; i <= rdoArray.length - 1; i++) {
                    if (rdoArray[i].type == 'radio') {
    
                        if (rdoArray[i].id != objId) {
                            rdoArray[i].checked = false;
                        } else {
                            var tdParent = $(rdoArray[i]).closest('tr');
                            var memCode = tdParent.children('td[id*="tdCustomerCode"]');
                            var memName = tdParent.children('td[id*="tdCustomerName"]');
                            $('#lbl_CustomerCode').text(memCode.text());
                            $('#lbl_CustomerName').text(memName.text());
                        }
                    }
                }
            }
        </script>
    
    <%--    <script type="text/javascript">
            function Pop_HOApprvl() {
                $(".modal-backdrop").remove();
                $("#Popu_HOApproval").modal('show');
            }
        </script>--%>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                <asp:Panel ID="Pnl_Reptr" runat="server" ScrollBars="Auto" Height="200px">
                    <div class="box-body">
                        <div class="row" style="padding: 10px;" id="Gridpanel" runat="server">
                            <div class="row">
                                <div class="row table-responsive" id="pnl_Repeater" runat="server" visible="True">
                                    <asp:Repeater runat="server" ID="rptLeadGrid">
                                        <HeaderTemplate>
                                            <table id="tblAttendance" class="table table-bordered table-striped" style="cursor: pointer; margin-bottom: 0px;">
                                                <tr style="background: #3c8dbc; color: #fff; font-size: 16px;">
                                                    <th>Insurance Claim Transaction Details</th>
                                                </tr>
                                            </table>
                                            <div class="table-responsive" style="background-color: #e2e2e2; padding-top: 5px;">
                                                <div class="box-body">
                                                    <table id="example1" class="table table-bordered table-hover" style="cursor: pointer; background-color: #fff;">
                                                        <thead style="background-color: #3c8dbc; color: #fff; font-size: 14px; border: none;">
                                                            <tr>
                                                                <%--<th id="thSN" runat="server">Sr#</th>--%>
                                                                <th id="thchk" runat="server">+</th>
                                                                <th id="thCustomerCode" runat="server">MemberCode</th>
                                                                <th id="thCustomerID" runat="server">MemberID</th>
                                                                <th id="thCustomerName" runat="server">Member Name</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                        </HeaderTemplate>
                                        <ItemTemplate>
                                            <tr style="font-size: 12px;">
                                                <%--<td id="tdSN" runat="server"><%#Container.ItemIndex + 1 %></td>--%>
                                                <td id="tdchk" runat="server">
                                                    <asp:RadioButton ID="rbt_row" runat="server" CssClass="btn btn-success" type="radio" onclick="fnCheckUnCheck(this.id);" />
                                                </td>
                                                <td id="tdCustomerCode" runat="server"><%#Eval("MEMBERCODE") %></td>
                                                <td id="tdCustomerID" runat="server"><%#Eval("MEMBERID") %></td>
                                                <td id="tdCustomerName" runat="server"><%#Eval("MEMBERNAME") %></td>
                                            </tr>
                                        </ItemTemplate>
                                        <FooterTemplate>
                                            </tbody></table> 
                                            </div>
                                            </div>  
                                        </FooterTemplate>
                                    </asp:Repeater>
                                </div>
                                <%--<center>
                                            <asp:Label ID="Label1" runat="server" Text="" ForeColor="red"></asp:Label>
                                            <asp:Label ID="lbl_trckingid" runat="server" Text="" ></asp:Label>
                                            </center>  --%>
                            </div>
                        </div>
                    </div>
                </asp:Panel>
                <asp:Label runat="server" ID="lbl_CustomerCode"></asp:Label>
                <br />
                <asp:Label runat="server" ID="lbl_CustomerName"></asp:Label>
            </div>
        </form>
    </body>
    protected void Page_Load(object sender, EventArgs e)
            {
                if (!Page.IsPostBack)
                {
                    bindReapter();
                }
            }
    
            private void bindReapter()
            {
                DataTable dt = new DataTable();
                string conStr = ConfigurationManager.ConnectionStrings["conStr"].ToString();
                using (SqlConnection conn = new SqlConnection(conStr))
                {
                    string query = "select * from test_tbl";
                    using (SqlCommand cmd = new SqlCommand(query, conn))
                    {
                        SqlDataAdapter sda = new SqlDataAdapter(cmd);
                        sda.Fill(dt);
                        rptLeadGrid.DataSource = dt;
                        rptLeadGrid.DataBind();
                    }
                }
            }

    Result:

    I did not find the corresponding controls to receive data in the code you provided, I added them for testing.

    Best regards,

    Xudong Peng 

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, October 5, 2020 2:39 AM

All replies

  • User-939850651 posted

    Hi ayyappen.CNN,

    According to your description, I tried using the code you provided. I modified some of the code to achieve your requirements. You could try the .children jQuery function.

    A simple example:

    <head runat="server">
        <title></title>
        <script src="Scripts/jquery-3.5.1.min.js"></script>
        <script type="text/javascript">
            function fnCheckUnCheck(objId) {
    
                var rdoArray = document.getElementsByTagName("input");
                for (i = 0; i <= rdoArray.length - 1; i++) {
                    if (rdoArray[i].type == 'radio') {
    
                        if (rdoArray[i].id != objId) {
                            rdoArray[i].checked = false;
                        } else {
                            var tdParent = $(rdoArray[i]).closest('tr');
                            var memCode = tdParent.children('td[id*="tdCustomerCode"]');
                            var memName = tdParent.children('td[id*="tdCustomerName"]');
                            $('#lbl_CustomerCode').text(memCode.text());
                            $('#lbl_CustomerName').text(memName.text());
                        }
                    }
                }
            }
        </script>
    
    <%--    <script type="text/javascript">
            function Pop_HOApprvl() {
                $(".modal-backdrop").remove();
                $("#Popu_HOApproval").modal('show');
            }
        </script>--%>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                <asp:Panel ID="Pnl_Reptr" runat="server" ScrollBars="Auto" Height="200px">
                    <div class="box-body">
                        <div class="row" style="padding: 10px;" id="Gridpanel" runat="server">
                            <div class="row">
                                <div class="row table-responsive" id="pnl_Repeater" runat="server" visible="True">
                                    <asp:Repeater runat="server" ID="rptLeadGrid">
                                        <HeaderTemplate>
                                            <table id="tblAttendance" class="table table-bordered table-striped" style="cursor: pointer; margin-bottom: 0px;">
                                                <tr style="background: #3c8dbc; color: #fff; font-size: 16px;">
                                                    <th>Insurance Claim Transaction Details</th>
                                                </tr>
                                            </table>
                                            <div class="table-responsive" style="background-color: #e2e2e2; padding-top: 5px;">
                                                <div class="box-body">
                                                    <table id="example1" class="table table-bordered table-hover" style="cursor: pointer; background-color: #fff;">
                                                        <thead style="background-color: #3c8dbc; color: #fff; font-size: 14px; border: none;">
                                                            <tr>
                                                                <%--<th id="thSN" runat="server">Sr#</th>--%>
                                                                <th id="thchk" runat="server">+</th>
                                                                <th id="thCustomerCode" runat="server">MemberCode</th>
                                                                <th id="thCustomerID" runat="server">MemberID</th>
                                                                <th id="thCustomerName" runat="server">Member Name</th>
                                                            </tr>
                                                        </thead>
                                                        <tbody>
                                        </HeaderTemplate>
                                        <ItemTemplate>
                                            <tr style="font-size: 12px;">
                                                <%--<td id="tdSN" runat="server"><%#Container.ItemIndex + 1 %></td>--%>
                                                <td id="tdchk" runat="server">
                                                    <asp:RadioButton ID="rbt_row" runat="server" CssClass="btn btn-success" type="radio" onclick="fnCheckUnCheck(this.id);" />
                                                </td>
                                                <td id="tdCustomerCode" runat="server"><%#Eval("MEMBERCODE") %></td>
                                                <td id="tdCustomerID" runat="server"><%#Eval("MEMBERID") %></td>
                                                <td id="tdCustomerName" runat="server"><%#Eval("MEMBERNAME") %></td>
                                            </tr>
                                        </ItemTemplate>
                                        <FooterTemplate>
                                            </tbody></table> 
                                            </div>
                                            </div>  
                                        </FooterTemplate>
                                    </asp:Repeater>
                                </div>
                                <%--<center>
                                            <asp:Label ID="Label1" runat="server" Text="" ForeColor="red"></asp:Label>
                                            <asp:Label ID="lbl_trckingid" runat="server" Text="" ></asp:Label>
                                            </center>  --%>
                            </div>
                        </div>
                    </div>
                </asp:Panel>
                <asp:Label runat="server" ID="lbl_CustomerCode"></asp:Label>
                <br />
                <asp:Label runat="server" ID="lbl_CustomerName"></asp:Label>
            </div>
        </form>
    </body>
    protected void Page_Load(object sender, EventArgs e)
            {
                if (!Page.IsPostBack)
                {
                    bindReapter();
                }
            }
    
            private void bindReapter()
            {
                DataTable dt = new DataTable();
                string conStr = ConfigurationManager.ConnectionStrings["conStr"].ToString();
                using (SqlConnection conn = new SqlConnection(conStr))
                {
                    string query = "select * from test_tbl";
                    using (SqlCommand cmd = new SqlCommand(query, conn))
                    {
                        SqlDataAdapter sda = new SqlDataAdapter(cmd);
                        sda.Fill(dt);
                        rptLeadGrid.DataSource = dt;
                        rptLeadGrid.DataBind();
                    }
                }
            }

    Result:

    I did not find the corresponding controls to receive data in the code you provided, I added them for testing.

    Best regards,

    Xudong Peng 

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Monday, October 5, 2020 2:39 AM
  • User-582711651 posted

    Hi, 

    Excellent, it works .

    Thanks

    Monday, October 5, 2020 7:33 AM