Solved

add comma delimited string to a hiddenfield on my page

Posted on 2011-02-16
5
753 Views
Last Modified: 2012-05-11
I have a gridview that displays client data. The first column on each row for the gridview is a checkbox.  The second column on the gridview is client name and the third column is account holder. The user can select checkboxes (on multiple rows) to modify data (account holder).

I want to add clientName column value in a comma delimited string to a hiddenfield on my page.
How do I do that using javascript, as I do not want to use postback and looping through each row on the grid to get the checkbox status. When a checkbox is checked, it should append the hiddenfield value.

I am a newb on javascript. Please review my javascript code and suggest corrections. I am getting the hiddenfield value as blank no matter what checkboxes are checked. I also know that my code is not targeting the correct row to get ClientName (row where checkbox is checked).

Any help is highly appreciated.

Thanks.

function RowClick(CheckBox) 
        {
            var BaseControl = document.getElementById('<%= this.myGrid.ClientID %>');
            var TargetControl = document.getElementById('MyHiddenField');
            for (var i = 0; i < BaseControl.rows.count; i++)
            {
                var rowElem = BaseControl.rows[i];
                for (var x = 0; x < rowElem.cells.count; x++) 
                {
                    var ClientName = rowElem.cells[1];
                    if (CheckBox.checked) TargetControl.Text += "," + Case_Id;
                }
            }
        }

Open in new window

0
Comment
Question by:patd1
  • 3
5 Comments
 
LVL 20

Expert Comment

by:chaitu chaitu
ID: 34913407
can you post the view source code??
0
 
LVL 13

Accepted Solution

by:
hiteshgoldeneye earned 500 total points
ID: 34913431
Correct me if i am wrong but are you referring to  the right variable name when appending to the hiddenfield (TargetControl.Text)

See revised code below
function RowClick(CheckBox) 
        {
            var BaseControl = document.getElementById('<%= this.myGrid.ClientID %>');
            var TargetControl = document.getElementById('MyHiddenField');
            for (var i = 0; i < BaseControl.rows.count; i++)
            {
                var rowElem = BaseControl.rows[i];
                for (var x = 0; x < rowElem.cells.count; x++) 
                {
                    var ClientName = rowElem.cells[1];
                    if (CheckBox.checked) TargetControl.Text += "," + ClientName;
                }
            }
        }

Open in new window

0
 

Author Comment

by:patd1
ID: 34917988
Please find attached partial view source code. Pasting the whole thing will make reading it too complicated. Please let me know if you need any other part to help me. Appreciate your help.

Thanks.

<td align="center">
                                    <span id="ctl00_ContentPlaceHolderMain_Error"></span>
                                    <input type="hidden" name="ctl00$ContentPlaceHolderMain$MyHiddenField" id="ctl00_ContentPlaceHolderMain_MyHiddenField" />                                    
                                </td>

....
..
..


</th><th scope="col"><a href="javascript:__doPostBack(&#39;ctl00$ContentPlaceHolderMain$gvWorklist&#39;,&#39;Sort$CaseNo&#39;)">Case Number</a></th><th scope="col"><a href="javascript:__doPostBack(&#39;ctl00$ContentPlaceHolderMain$gvWorklist&#39;,&#39;Sort$CaseID&#39;)">CaseID</a></th><th scope="col"><a href="javascript:__doPostBack(&#39;ctl00$ContentPlaceHolderMain$gvWorklist&#39;,&#39;Sort$ClientName&#39;)">Client Name</a></th><th scope="col"><a href="javascript:__doPostBack(&#39;ctl00$ContentPlaceHolderMain$gvWorklist&#39;,&#39;Sort$CompanyName&#39;)">Company Name</a></th><th scope="col"><a href="javascript:__doPostBack(&#39;ctl00$ContentPlaceHolderMain$gvWorklist&#39;,&#39;Sort$PatientName&#39;)">Patient Name</a></th><th scope="col"><a href="javascript:__doPostBack(&#39;ctl00$ContentPlaceHolderMain$gvWorklist&#39;,&#39;Sort$CreatedDate&#39;)">Created Date</a></th><th scope="col"><a href="javascript:__doPostBack(&#39;ctl00$ContentPlaceHolderMain$gvWorklist&#39;,&#39;Sort$AssignedDoctor&#39;)">Assigned Doctor</a></th>
			</tr><tr>
				<td>
                                                    <input id="ctl00_ContentPlaceHolderMain_gvWorklist_ctl02_CheckBoxActiveClient" type="checkbox" name="ctl00$ContentPlaceHolderMain$gvWorklist$ctl02$CheckBoxActiveClient" onclick="javascript:RowClick(this);" />
                                                </td><td align="left" style="white-space:nowrap;">
                                                    <span id="ctl00_ContentPlaceHolderMain_gvWorklist_ctl02_LabelCaseNumber">OTH11-000511</span>
                                                </td><td style="white-space:nowrap;">186450</td><td style="white-space:nowrap;">C702</td><td>Georgia Cancer Specialists-Macon Coliseum</td><td>TEST1, Deep </td><td style="white-space:nowrap;">2/15/2011 11:51:33 PM</td><td align="left">
                                                    <span id="ctl00_ContentPlaceHolderMain_gvWorklist_ctl02_LabelAssignedDoctor"></span>
                                                </td>
			</tr><tr class="alt">
				<td>
                                                    <input id="ctl00_ContentPlaceHolderMain_gvWorklist_ctl03_CheckBoxActiveClient" type="checkbox" name="ctl00$ContentPlaceHolderMain$gvWorklist$ctl03$CheckBoxActiveClient" onclick="javascript:RowClick(this);" />
                                                </td><td align="left" style="white-space:nowrap;">
                                                    <span id="ctl00_ContentPlaceHolderMain_gvWorklist_ctl03_LabelCaseNumber">OTH11-000509</span>
                                                </td><td style="white-space:nowrap;">186440</td><td style="white-space:nowrap;">C702</td><td>Georgia Cancer Specialists-Macon Coliseum</td><td>TEST, CASE </td><td style="white-space:nowrap;">2/8/2011 6:36:50 PM</td><td align="left">
                                                    <span id="ctl00_ContentPlaceHolderMain_gvWorklist_ctl03_LabelAssignedDoctor"></span>
                                                </td>
			</tr><tr>
				<td>
                                                    <input id="ctl00_ContentPlaceHolderMain_gvWorklist_ctl04_CheckBoxActiveClient" type="checkbox" name="ctl00$ContentPlaceHolderMain$gvWorklist$ctl04$CheckBoxActiveClient" onclick="javascript:RowClick(this);" />
                                                </td><td align="left" style="white-space:nowrap;">
                                                    <span id="ctl00_ContentPlaceHolderMain_gvWorklist_ctl04_LabelCaseNumber">OTH11-000508</span>
                                                </td><td style="white-space:nowrap;">186428</td><td style="white-space:nowrap;">C702</td><td>Georgia Cancer Specialists-Macon Coliseum</td><td>TEST, CASE </td><td style="white-space:nowrap;">1/27/2011 5:05:07 PM</td><td align="left">
                                                    <span id="ctl00_ContentPlaceHolderMain_gvWorklist_ctl04_LabelAssignedDoctor"></span>
                                                </td>

Open in new window

0
 

Assisted Solution

by:patd1
patd1 earned 0 total points
ID: 34930327
I used viewstate = true on the grid and tracked my checkboxes in a ayyar in the OnDataBinding event and then reassigned the checks in the RowDatabound event. That took care of the requirments without the javascript.

Thanks to all for help though.
0
 

Author Closing Comment

by:patd1
ID: 34959267
used a different solution.
0

Featured Post

Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

Join & Write a Comment

Calculating holidays and working days is a function that is often needed yet it is not one found within the Framework. This article presents one approach to building a working-day calculator for use in .NET.
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

760 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now