What's wrong in this, i want to pass the value to the field of the specific form
var formid = 'addtaskform{/literal}{$smarty.session.formno}{literal}';
document.formid.title.value = 'yeah';
i am getting this error
TypeError: document.getElementById(...) is null
There is no problem with concatenation in that case. You probably do something else wrong.
Look at the following example:
PHP file:
$_SESSION['formno'] = 5;
$smarty->display('test.tpl');
Smarty template file:
<input type="text" id="addtaskform5" value="5" />
<script type="text/javascript">
{literal}
var formid = 'addtaskform{/literal}{$smarty.session.formno}{literal}';
document.getElementById(formid).value = 'yeah';
{/literal}
</script>
It works fine. Value of input is changed from 5 to yeah
You most likely don't have a form element with the id formid in your site, at least it is not what you actually want to achieve.
What you are looking for is this:
document[formid].title.value = 'yeah';
document.formid (Dot Notation) : get the element with the id formid
document[formid] (Bracket Notation): get the element with the id that is stored in the value formid
Related
I want to ask how I can print a Javascript variable in HTML form (e.g. output it on the screen)?
Here is my JS code:
<script type="text/javascript">
var howLongIsThis = myPlayer.duration();
</script>
This var howLongIsThis = myPlayer.duration(); is Jquery variable!
So how i can show this value in HTML page?
Set it to be the innerHTML or value of a html element:
var howLongIsThis = myPlayer.duration();
var displayEl = document.getElementById("duration");
displayEl.innerHTML = howLongIsThis;
or if you want in in a form field:
displayEl.value = howLongIsThis;
Assuming you have a <div id="example"></div> somewhere in your HTML, you want to run JavaScript after the DOM has loaded which adds the value you want to that div. In jQuery (which you specified in your question you're using), this would simply be:
$('div#example').html(myPlayer.duration());
Here's a fiddle: http://jsfiddle.net/RyanJW/QjXKL/2/
Try this,
your HTML
<input type="text" id="logId" />
<div id="logId1"></div>
js Script
var howLongIsThis = myPlayer.duration();
document.getElementById("logId").value=howLongIsThis;
document.getElementById("logId1").innerHTML=howLongIsThis;
hope this will give you an idea to solve your problem
I'm working on a website and was experiencing this problem, so I simplified it as much as possible.
index.html:
<html>
<head></head>
<body>
<script type="text/javascript" src="test.js"></script>
<form id="myForm" onsubmit="log(this.id)">
<input name="id">
</form>
</body>
</html>
test.js:
function log(str){
console.log("str=" + str);
}
When I submit the form, I see this:
str=[object HTMLInputElement]
and when I change the value of name to anything but "id", I see the expected
str=myForm
I get the exact same behavior if I switch all instances of "name" and "id" in the code. In other words, it doesn't seem to be a particular limitation of either attribute, but something more general.
I'm running MAMP on OS X 10.8; experiencing problem in Firefox 22.0 and Chrome ver. 28.
Thanks in advance
The .id on form elements accesses form fields by their name. To get the ID attribute use this.getAttribute('id').
When you gave the input the name "id", log(this.id) translates to log(myForm.id) where id is a property of myForm, it is in fact the input child element. This is indicated by the [object HTMLInputElement] class name which appears.
When you name the input child control to something else this.id now refers to the forms id attribute.
The same logic applies when you switch "id" with "name" since you can refer to controls by either their name or id.
Well, that's because this.id is being interpreted as "the element with name id that belongs to the form", that's why you're receiving an [object HTMLInputElement] through the parameter. When there is no such input (i.e. when you name it differently), this.id is interpreted as the form id.
I have multiselect element just like StackOverflow does with their tags. I don't know how to write the jQuery statement that will retrieve the multiple values that were selected.
Here is what I have so far.
HTML
<input id="tagSelect" style="width:400px;" type="text"/>
Here is my Javascript
var tag = $('#tagSelect').val();
Here is the plugin that it uses
http://nicolasbize.github.com/magicsuggest/
There are two ways to retrieve the values with the plugin:
If the combo is included within a classic form like this:
<form method="POST" action="submit.php">
<div id="ms"></div>
</form>
<script type="text/javascript">
var combo = $('#ms').magicSuggest({
data: 'a,b,c,d,e',
name: 'choice'
});
</script>
then the selection will be serialized in the parameter $_POST['choice'].
If you need to retrieve the values through javascript, there is a getValue() method which will return an array of values:
ms.getValue();
This solution does not appear to work.
When trying to execute ms.getValue(); the following error message is logged:
TypeError: ms.getValue is not a function[Learn More]
I run into a problem while using jQuery templates (http://api.jquery.com/category/plugins/templates/)
First: defined a template like this one:
<td>
<input type="text" value="${Text}" />
</td>
When it renders user types some text into it, but I don't know how to get what he types. All I receive is old "value" attribute value.
The code I use to get data back:
var enteredData = row.tmplItem();
var note = enteredData.data;
var data = {};
data.NoteId = note.NoteId;
data.NoteText = note.Text;
I'd be grateful for any help!
Thank you!
You should be able to use
$('input').val()
to get the entered value
(obviously it would be best to give the input an id so you don't call all inputs on the page!)
try this:
<td>
<input type="text" value="${Text}" id="text${id}"/>
</td>
and
$('#text'+ id).val() //if you want a specific one of more inputs
or just set a static id if you only have one....
Below is the sample code in my JSP page:
<form name = loginform method = post action="">
<table class=registerTable>
<tr>
<td>Username:</td></tr>
<tr><td>
<input name=user type=text class=usnm required size=28 maxlength=35 autocomplete="off" onblur="validateUser()" onkeyup="checkUsernameAvailability(this.value)"><br></td></tr>
<tr><td>
<span id = uerrmsg class = error></span><br></td></tr>
</table>
</form>
When onblur=validateUser() is called the following code executes:
function validateUser(){
if(loginform.user.value.length<5){
document.getElementById("uerrmsg").innerHTML="minimum 5 characters";
return false;
}else{
document.getElementById("uerrmsg").innerHTML="";
return true;
}
}
Error Console in FF gives the following error
loginform is not defined
Please help me on this.
PS: Above code works in all other browser.
you can use input.getAttribute("name") to get name attribute of an input.
This works for almost all browsers.
By the way, if you use getElementById, you must populate "id" field of input.
You should be using document.loginform.
You don't need the form for this.
First give your input an id: id="user". Then you can access it using document.getElementById(), as you do with the element. something like this:
document.getElementById("user").value.length
Also, your code is very non-standard, for eg you should not put a " " (space) between the attribute (or it's value) and the = sign. And the attributes' values should be within quotes (Look at the source code of this page, for example).