Solved

How to get values from textboxes

Posted on 2013-02-07
7
198 Views
Last Modified: 2013-03-07
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
0
Comment
Question by:runnerjp2005
  • 3
  • 3
7 Comments
 
LVL 42

Accepted Solution

by:
sedgwick earned 500 total points
Comment Utility
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
 

Author Comment

by:runnerjp2005
Comment Utility
how would i do this in vb.net though rather then javascript
0
 
LVL 42

Expert Comment

by:sedgwick
Comment Utility
do you mean that you want to get the value of your dynamic generated text-boxes values, in your code behind?
0
How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 

Author Comment

by:runnerjp2005
Comment Utility
yes thats it :)
0
 
LVL 42

Expert Comment

by:sedgwick
Comment Utility
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
 

Author Comment

by:runnerjp2005
Comment Utility
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
 
LVL 10

Expert Comment

by:Monica P
Comment Utility
0

Featured Post

What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

Join & Write a Comment

ASP.Net to Oracle Connectivity Recently I had to develop an ASP.NET application connecting to an Oracle database.As I am doing it first time ,I had to solve several problems. This article will help to such developers  to develop an ASP.NET client…
For those of you who don't follow the news, or just happen to live under rocks, Microsoft Research released a beta SDK (http://www.microsoft.com/en-us/download/details.aspx?id=27876) for the Xbox 360 Kinect. If you don't know what a Kinect is (http:…
In this seventh video of the Xpdf series, we discuss and demonstrate the PDFfonts utility, which lists all the fonts used in a PDF file. It does this via a command line interface, making it suitable for use in programs, scripts, batch files — any pl…
This tutorial demonstrates a quick way of adding group price to multiple Magento products.

744 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

15 Experts available now in Live!

Get 1:1 Help Now