assigning initial value of input text field with jquery - javascript

I am trying to assign an initial value to a text box with using jquery. This is the text field
<input type="text" class="info"/>
This creates more than one text fields and I need to populate the text fields with initial values which come from database. I am having problem since I am trying to it with jquery adapter.
Any clue on this?
Thanks in advance.
Here is the detailed code:
I include index.html
<?php include "index.html"?>;
which puts some text fields to record.php:
...
...
After including index.html I am using this code to assign intial value to the text boxes which have a class name "info":
$('.info').each(function() {
$('.info').val('yourvalue');
});
Instead of assigning a constant value (here it is "yourvalue") I am going to assing some database records to each input fields.

$('.info').val('yourvalue');
replace yourvalue with the value you want to set..
Set this value in the success callback of your ajax request..

$('.info').val('value-to-be-set');
.val( value ) - Set the value of each element in the set of matched
elements
Above code will set the value of the input fields where the class name if 'info'
Read More here

$('.aciklama').each(function() { $('.aciklama').val('yourvalue'); });
you know $('.aciklama') is an array , and when you iterator you array get the object, you still get the $('.aciklama') array and set the array value, as I see It is not correct.
You should write like this:
$('.aciklama').each(function(index, item) { $(item).val('yourvalue'); });

Related

how to get value in javascript from document.getElementsByClassName('myTxtBox');

The html for the textbox I was to get the value from is created from a .js file -- from javascript. I tried this to get the value that I enter into myTxtBox which is defined by a className:
<input type='text' class='myTxtBox editable' name='myTxtBox' value='' maxlength='200' size='90'/>
....
I try to retrieve the value I enter into myTxtBox as follows:
var txtval = document.getElementsByClassName('myTxtBox');
alert(txtval);
...more stuff where I set a breakpoint
the alert says I have [object htmlcollection]
intellisense does not give me .value -- I only get txtVal.valueOf, but when I break into the code and hover over txtval I get a listing for >Methods, ..., >myTxtBox. When I expand the >myTxtBox list if I scroll to the bottom of that listing I DO see "value" in >myTxtBox list and it DOES equal what I entered on the web page.
How do I retrieve that value? I have tried all sorts of options from the intellisense, but it either gives an error msg or [object htmlcollection] on the alert. How do I retrieve the value I entered? Or -- do I use something different than document.getElementsByClassName('myTxtBox') for my scenario?
You would need to return the index + value as getElementsByClassName returns a HtmlCollection so there are many elements to it.. try this:
var val = document.getElementsByClassName('myTxtBox')[0].value
alert(val)
getElementsByClassName returns a HtmlCollection which is array like. Do this like this:
var txtval = document.getElementsByClassName('myTxtBox')[0].value
alert(txtval)
I discovered that I could add an ID to my input element 'myTxtBox' and use jquery to retrieve the desired value, so I did this -- added an ID to the textbox and use jquery in the alert to do a document.getelementbyID
//--generate the html section here
"...<input type='text' class='myTxttBox editable datepicker' id='myTxtBox' name='myTxtBox' value='' size='10'/>..."
function NextButton_Click()
{
try
{
alert($("#PositionStartDateTextBox").val()); <---and this displays the value entered into this textbox
....
The whole deal is I have to evaluate some date textboxes because users can enter values in manually -- I guess the best fix would be for this textbox to not be editable. That would be another question -- how to add a datepicker and not have an editable textbox.

Passing jQuery this.id in class selector

I have two different input fields, it uses typeahead.
In first field we enter Country and in other we should select City, depending on Country.
So I'm making a javascript/jQuery function, to pass field ID, to know, which of 3 pairs of Country+City pair am I selecting.
i'm using
$('.demoTypeAhead').typeahead({
source: getCityForCountry($(this).id)
});
in function getCityForCountry, I would like to pass a field specific id, but neither $(this), or this works, since it returns whole DOM object.
A jQuery object does not have an .id property. You either want
this.id // or
$(this).prop("id") // or even
$(this).attr("id")
$(this) on this scope does not return input as an object, but whole page as an object...
Just made jsfiddle for it:
Jsfiddle http://jsfiddle.net/s1d8nmqr/3/
I would like to reload data source of typeahead for second input, when I select first one (2 level select)

How to insert selected element from multiple selection into an input?

hi everyone i have a problem.
i have a multiple selection and i want to select something and put it into an input through a button i hope i have been clear :
i manage to get the select item with this jquery code :
var chosen= $('#droite option:selected').val();
droite is an id for the multiple selection
and i want to put it into the input wich has an id : chosen item here is my jquery code:
$("#chosenitem").prepend(chosen);
and it won't work do you have any idea why .?
You need to call val() on the select itself, not the options it contains:
var chosen = $('#droite').val();
Similarly, to set the value of the #chosenitem input, use val() with a parameter:
$("#chosenitem").val(chosen);
Note that if multiple options are selected in the #droite element, the value returned will be a comma delimited string, eg. foo,bar,baz.
You should call val() to set the value of #chosenitem
$("#chosenitem").val(chosen);

Set and get value of input with jStorage

I'm using jStorage to store the value of an input, when I click the save button. Then I want to set the stored value as the current input value on page load. It ain't working too well though.
HTML
<input type='text' id='name'>
<div id="save">Save</div>
JS
$('#save').click(function() {
$.jStorage.set("key", $("#name").val());
});
var input_value = $.jStorage.get("key");
It's a little tangled up:
$.jStorage.set("key", $("#name").val());
var input_value = $.jStorage.get("key");
When you're passing a selector to jQuery you have to pass a valid string, not just the raw CSS selector syntax. That is, you've got to get the selector expression into JavaScript first, and you do that by creating a string constant.
edit — If you want your <input> to show the last-saved value when the page loads, you'd do something like this:
$(function() {
$('#name').val( $.jStorage.get("key") || "" );
});
Wrapping the activity in a $(function() { ... }) wrapper ensures that the code won't run until the <input> field has been seen and parsed by the browser, but still very soon after the user sees the page load (essentially immediately).
Adding the extra || "" bit after the jStorage call ensures that if the value is null or undefined the user won't see that. If there's no stored value, in other words, that'll have the input just be empty. You could put any other default value in there of course.

wrong value returned while getting value of dynamically created textbox using Javascript

I've dynamically added some rows to my ASP.NET table using JavaScript, my rows contain textboxes (which are in fact spans), it is my textbox HTML which as added to my table:
var spanCount = document.createElement("span");
spanCount.innerHTML = "<input style=\"width:30px\" type=\"text\" name=\"count\" value=1>";
later I change default value of this textbox (default value is 1), and I want to get current value of this dynamically created textbox using JavaScript, I use following code to get its value, but I always get 1 (default value), I want to have current value of this textbox:
alert(document.getElementById('<%=tblFoodList.ClientID %>').rows[1].cells[3].firstChild.innerHTML);
but I get following HTML (I can parse its value):
<input style="width:30px" name="count" value="1" type="text"
as you can see, value="1", but I have changed value, is there any way that I can get current value (or HTML) of this span?
You should use .value instead of .innerHTML to get the text value of an input.
Assuming your structure:
alert(document.getElementById('<%=tblFoodList.ClientID%>') // this is your table
.rows[1] // second row
.cells[3] // third column
.firstChild // the span you created
.firstChild // the input
.value // the value of the input
);

Categories

Resources