We Keep Coding

JQuery Not Triggering On Button.click

I've written some code that should check a textbox (ID tfa_1) to see if its empty or contains text, this should trigger on a next page button (wfpagenextID6) being clicked.
I've tried replacing my script with an alert("test.") and it dosent appear, so im assuming I have my trigger wrong but I cannot work out what I have done wrong!
My HTML that defines the textbox is below:
<input type="text" id="tfa_2685" name="tfa_2685" value="" placeholder="" title="Previous Surname (if applicable) " class="">
and the button is
<input value="Next Page" type="button" class="wfPageNextButton" wfpageindex_activate="7" id="wfPageNextId6" style="visibility: visible;">
Both of these are generated and I cannot change them!
My Script is:
<script>
$(document).ready(function(){
$('#wfPageNextId6').click(function(){
var inp.Val= $("#tfa_2685").val();
if (inp.val().length > 0) {
alert("Test.");
}
});
})
</script>

An identifier ( variable ) must not contains dots. ( see more details ECMAScript specification in section 7.6 Identifier Names and Identifiers)
the next variable declaration is wrong
var inp.Val= $("#tfa_2685").val();
to fix this
var inp = $("#tfa_2685");

if you want to assign value to inp variable, you should just do: var inp = $("#tfa_2685").val();
And then call to inp.val() just replace with inp, for inp is not jQuery object so it doesn't have val() method

You have syntax, try this:
$(document).ready(function(){
$('#wfPageNextId6').click(function(){
var inpVal= $("#tfa_2685").val();
if (inpVal.length > 0) {
alert("Test.");
}
});
});
https://jsfiddle.net/cua40s80/

Copy a script value to Input tag

I have a page counter that I want to put into a form input value.
Here is the script:
<script id="counter">
if (localStorage.pagecount)
{
localStorage.pagecount=Number(localStorage.pagecount) +1;
}
else
{
localStorage.pagecount=1;
}
document.write(localStorage.pagecount);
</script>
And this is where I want it to go:
<input id="RR_No" type="text" size="10" name="RR_No" required>
But I don't know how to copy the value.
I'm really new to javascript so if you can reply with really simple answers that would really help.
Thanks,
Chris

document.getElementById('RR_No').value = localStorage.pagecount;
document.getElementById is used to find the DOM element with id="RR_No". The .value property is used to set or retrieve the value of an input element.

Replace document.write line with:
document.getElementById('RR_No').value = localStorage.pagecount;
<input id="RR_No" type="text" size="10" name="RR_No" required>

Instead of document.write write:
document.getElementById('RR_No').value = localStorage.pagecount
Checkout This DEMO: http://jsbin.com/komofe/1/

get element type from element found by class

Im trying to create a function that will get the "value" of any type of any element that has a specific class (textarea, span,... whatever)
To do this I need to test what kind of element Im currently dealing with which I can do easily enough with alert($('#gdocDump').prop('tagName')); but for some reason if I grab all elements of the same class with var varElems=$(".feedback"); and try to loop through them testing each one like var elementType = elem.prop('tagName');, I get the error "TypeError: elem.prop is not a function"
Why does this happen?
Apparently the elements stored in the jQuery object created by
$(".feedback") are not quite the same as looking at each
individually?
What do I need to change for var elementType =
elem.prop('tagName'); to work properly below?
jsFiddle:Testing Ground
HTML
<textarea id="gdocDump" class="feedback area" rows="1" cols="22" ></textarea><br />
<input id="scaleSlider" class="feedback" type="range"value="1" min="1" max="9" step="1"/><br />
<span id="command1" class="feedback">This is a span</span><br />
<span id="command2" class="feedback">This is a span</span><br /><br />
<input type="button" id="sendFeedback" value="Feedback"/><br /><br /><br /><br />
<input type="button" id="test" value="Test a specific element"/>
Javascript:
$("#sendFeedback").click(function() {
composeAndCallEmail();
});
$("#test").click(function() {
alert($('#gdocDump').prop('tagName'));
});
function composeAndCallEmail() {
var varElems=$(".feedback");
var feedback=[];
$(varElems).each(function(index, element) {
feedback.push(getElemContents(element))
});
}
function getElemContents(elem){
var elementType = elem.prop('tagName');
//this is where the problem occurs
if(elementType=='INPUT')return elem.val();
//... will add more here later
}

Inside each(index, element) the arguments are the index and the native DOM element
$(varElems).each(function(index, element) {
feedback.push(getElemContents(element)) // plain DOM element, not jQuery
});
that means you have to wrap it again or use the native elem.tagName property
function getElemContents(elem){
var elementType = $(elem).prop('tagName');
if ( elementType.toLowerCase() === 'input' )
return $(elem).val();
}

As commented above, you're calling jQuery method prop() on a DOM node; instead use elem.tagName.
Similarly in getElemContents() you should use .value rather than .val(). Finally this should give you:
function getElemContents(elem){
var elementType = elem.prop.tagName;
if(elementType=='INPUT')return elem.value;
//... will add more here later
}
JS Fiddle demo.

jscript 'type' attribute

Im trying to implement the following logic on javascript.
If type is 'bankAccountTypeId' get all fields with the same className as field using $(field.className) then use .each to loop through each result compare field.value with $(this).val() and use alert to show an error message if they are different (break if fail).
function onChange_productListField(field, type) {
if (HimmsJSUtil.elementHasClass(field, 'DC')) {
var allProductGroupFields = $(".DC."+type);
var value = field.value;
if (field.options) {
value = HimmsJSUtil.getSelectedDropDownOption(field);
}
allProductGroupFields.each(function(index) {
if ($(this).attr("id") != field.id
&& !$(this).val()) {
$(this).val(value);
}
});
} else {
/* implement the logic here */
}
}
My question is , how would the type attribute work, within this logic?

Firsly let's make clear that jscript is not javascript and "type" in your code is not attribute but just a parameter of the function.
var allProductGroupFields = $(".DC."+type);
The above line uses jQuery to select a group of elements having classes "DC" and "bankAccountTypeId" at the same time where type is "bankAccountTypeId". Such a code can be used in a structure like this:
<div class="whatever">
<input type="text" class="DC bankAccountTypeId" />
<input type="text" class="DC userId" />
<a href="http://stackoverflow.com/questions/1041344">
jQuery multiple class selector
<a>
</div>
Extra:
For a structure like this
<div class="DC">
<input type="text" class="bankAccountTypeId" />
<input type="text" class="userId" />
<a href="http://stackoverflow.com/questions/3767512">
jQuery class within class selector
<a>
</div>
the selector line must be changed to
var allProductGroupFields = $(".DC ."+type);

can the name of a input tag be changed with javascript?

I want to know if its possible to change the name of the input tag with javascript or jquery, for example in this code :
<input type="radio" name="some_name" value="">
I want to change the some_name value when user select this radio button.
the reason what i want to do this is described here : How might I calculate the sum of radio button values using jQuery?

Simply elem.name = "some other name" or elem.setAttribute("name", "some other name") where elem is the element you want to alter.
And to do that on selection, use the onchange event:
<input type="radio" name="some_name" value="" onchange="if(this.selected) this.name='some other name'">
And to apply that behavior to every radio button with that name:
var inputElems = document.getElementsByTagName("input");
for (var i=inputElems.length-1; i>=0; --i) {
var elem = inputElems[i];
if ((elem.type || "").toLowerCase() == "radio" && elem.name == "some_name") {
elem.onchange = function() {
if (this.selected) {
this.name = "some other name";
}
};
}
}
But using jQuery for that is quite easier.

The jQuery way
$('input:radio[name="some_name"]').attr('name', 'new name');
Gumbo has the vanilla JavaScript way covered

Yes, you can change the name of any element with javascript. Keep in mind though that IE 6 and 7 have trouble with submitted forms where the input elements have been tinkered with in javascript (not sure if this exact case would be affected).
$('input:radio[name="some_name"]').attr('name', 'new_name');
Edit: To change it only when it is selected, here is the code for that:
$("input:radio[name='some_name']").click(function() {
if ($(this).attr('checked')) $("input:radio[name='some_name']").attr('name', 'new_name');
else $("input:radio[name='some_name']").attr('name', 'some_name');
});

Sure. If jQuery is your poison, this should do the trick:
$("input[name=some_name]").attr("name", "other_name");

I came up with this:
<input type="radio" name="some_name" value="" id="radios">
<script type="text/javascript" charset="utf-8">
$(document).ready(function()
{
$("#radios").click(function()
{
$(this).attr("name", "other_name");
});
});
</script>

Trying to change the name attribute of a radio button will cause strange, undesirable behavior in IE.
The best way to handle this is to replace the old radio button with a new one. This post may help you. If you are using jQuery, you can do it with the replaceWith function.
More information about changing name attributes in IE.