How to get values from textboxes

Hello,

I am using javascript to add text boxes when i click add button

  $(".addButton").on("click", function () {
     


        var newTextBoxDiv = $(document.createElement('div'))
      .attr("id", 'TextBoxDiv' + counter);

        newTextBoxDiv.html(' <label class="alignme" for="repdist' + counter + '">Rep' + counter + ' - </label><label for="repdist' + counter + '">Distance:</label>' +
    ' <input  onkeypress="return IsNumber(event)"  name="repdist' + counter + '" type="text" id="repsit' + counter + '" style="width:30px;" />' +
   '  <select name="kmormile' + counter + '" id="kmormile' + counter + '"> ' +
     	'<option value="Miles">Miles</option>' +
        	'<option value="Km">Km</option>' +
           ' </select>' +
                      ' <label for="repmin' + counter + '">Min:</label>' +
                   '  <input onkeypress="return IsNumber(event)"  name="repmin' + counter + '" type="text" value="00" maxlength="2" id="repmin' + counter + '" style="width:30px;" />' +

                      ' <label for="repsec' + counter + '">Sec:</label>' +
                     '<input onkeypress="return IsNumber(event)"  name="repsec' + counter + '" type="text" value="00" maxlength="2" id="repsec' + counter + '" style="width:30px;" />');

        newTextBoxDiv.appendTo("#TextBoxesGroup");


        counter++;
    });

Open in new window


The issue is im not really sure how i can loop through them to get the values output.

Has anyone got any ideas??

The working code is shown here : http://jarrattperkins.com/training/addtraining.aspx
runnerjp2005Asked:
Who is Participating?
 
Meir RivkinConnect With a Mentor Full stack Software EngineerCommented:
in line 5 you code:
.attr("id", 'TextBoxDiv' + counter);

so basically you give your textbox unique id which can be used to retrieve its value:

for(var i=0;i<counter;i++){
var val = $('#TextBoxDiv'+i).text();
}

Open in new window

0
 
runnerjp2005Author Commented:
how would i do this in vb.net though rather then javascript
0
 
Meir RivkinFull stack Software EngineerCommented:
do you mean that you want to get the value of your dynamic generated text-boxes values, in your code behind?
0
Cloud Class® Course: Microsoft Exchange Server

The MCTS: Microsoft Exchange Server 2010 certification validates your skills in supporting the maintenance and administration of the Exchange servers in an enterprise environment. Learn everything you need to know with this course.

 
runnerjp2005Author Commented:
yes thats it :)
0
 
Meir RivkinFull stack Software EngineerCommented:
since the textboxes are not aspnet controls but generated on runtime in your client side, you have a few options:

1. use aspnet hidden field control.
you add it in your aspx page:
<asp:HiddenField runat="server" ID="txtboxValues" Value='' />

Open in new window

set its value in your client side:
//create json array
var txtboxValues = [];
for(var i=0;i<counter;i++){
txtboxValues.push($('#TextBoxDiv'+i).text());
}
//assign the hidden field
$("#<%: this.txtboxValues.ClientID %>").val(txtboxValues);

Open in new window

read it in your server side:
JavaScriptSerializer js = new JavaScriptSerializer();
string [] txtboxValues =  js.Deserialize<string>(this.txtboxValues.Value);

Open in new window


2. create web service and use ajax to pass the values to server side.
check here for guideline: Walkthrough: Creating and Using AJAX-Enabled Web Service
in your VS solution, aright click in your project and add Web Service.
add new service called:
[WebMethod]
public SendValues(List<string> values){
}

in your client side you call the web service like this:
var txtboxValues = [];
for(var i=0;i<counter;i++){
txtboxValues.push($('#TextBoxDiv'+i).text());
}
var jsonText = JSON.stringify({ list: txtboxValues});
     
    $.ajax({
      type: "POST",
     url: "WebService1.asmx/SendValues",
      data: jsonText,
      contentType: "application/json; charset=utf-8",
      dataType: "json",
     success: function() { alert("success"); },
     failure: function() { alert("failed"); }
  });

Open in new window

check here to pass string array to server side via ajax:
javascript-arrays-via-jquery-ajax-to-an-aspnet-webmethod
0
 
runnerjp2005Author Commented:
When im reading it on client side

JavaScriptSerializer js = new JavaScriptSerializer();
string [] txtboxValues =  js.Deserialize<string>(this.txtboxValues.Value);

Open in new window


how would i add it to my sql database
0
 
Monica PSoftware DeveloperCommented:
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.