JQuery on ASP.NET page with lots of dynamic controls
<p>I am at a bit of a loss.  We have an asp.net Questionaire that is being created dynamically based on business rules and data from SQL.  </p>

<p>The questionaire, which is a dynamic table, can have up to 21 questions and based on the response (radio buttons yes, no, in progress, NA) and more business rules, different things need to happen.  </p>

<p>Sometimes additional questions display in the right column or it can have a text box where the user needs to enter additional data, sometimes just comments with an explanation for the response are required and I also change the color of the cell based on response.  </p>

<p>It has turned into a javascript nightmare.  Currently we are adding an onclick event to each radio button and passing in some of the business rules that apply to that radiobutton.  </p>

<p>The biggest issue that I have is all of the controls are given ids based on row number, response,  etc.  So in the javascript function we are trying to piece together the Id of the needed control based on the information that is being passed to the function on the onclick event.  </p>

<p>The code that We have works but it is not very elegant and will most likely be a maintenance nightmare.  It seems to me there must be a better way using JQuery.  I just have no idea where to begin.  I hope this makes sense and I hope someone has a suggestion or a sample of something like this that I can use to rewrite this mess.</p>

<p>Here is a very very shortened version of the javascript.</p>

<pre><code>function radioButtonListOnClick1(buttonValue, QuestionNumber, hasInput, hasSubs, hasAdditional, isAdditional)
{
    var ClientID;
    var HidField = $("#HiddenFieldClientID");
    if (HidField.length == 1)
    {
        ClientID = HidField[0].value + "_";
    }
    var ColumnName = ClientID + "radioQuestionColumn" + QuestionNumber;
    if (buttonValue == "InProgress")
    {
        document.getElementById(ColumnName).className = 'tdInProgress';
    }
    if ((buttonValue == "Yes") || (buttonValue == "NotApplicable"))
    {
        document.getElementById(ColumnName).className = 'tdYes';
    }
    if (buttonValue == "No")
    {
        document.getElementById(ColumnName).className = 'tdNo';
    }
}

listItem.Attributes.Add("onclick", "radioButtonListOnClick('" + Response + "', '" + QuestionNumber + "', '" + hasInput + "', '" + hasSubs + "', '" + hasAdditional + "', 'no');");
</code></pre>

<p>Here is example of a question with the rules for different responses might look like.</p>

<p>1)  Do you have the name of a alternate user that can fill in for you in your absence?
yes - display a text box and text -"Please enter the employees name"  (column color is white)
no - display a link to a sharepoint document that explains why this is needed and who you should pick (column color is red)
In Progress  -  column color is yellow</p>
