Trying to use Jquery/javascript to calculate form fields - javascript

Im having a terrible time trying to calculate the value of two form fields. I'm constantly getting "NAN" which would indicate non-numeric input, this is despite the fact that the form fields are only populated with numbers.
In response I tried to use ParseInt to get a numeric value. This also fails to yield a successful result.
This is what I have so far. Any help is appreciated.
$('#value-calc input').change(function () {
var valueINT = parseInt($('#value'),10);
var quantINT = parseInt($('#quantity'), 10);
var math = ((valueINT/quantINT)*1000);
$('#cpm').val(math);
});
http://jsfiddle.net/greyoxide/YRWAA/1/

You need to add the .val() method after your selectors to get the value they hold
working fiddle

You're not passing in strings when you refer to elements by ID with that jQuery.
Perhaps try $('#value').val() in the parseInt methods instead.

Try this:
$('#value-calc input').keyup(function () {
var valueINT = $('#value').val();
var quantINT = $('#quantity').val();
var math = ((valueINT/quantINT)*1000);
$('#cpm').val(math);
});

Related

Detect if a div with id including number is clicked

My html code has X elements, with their ids in this form:
viewer_mX
Here, X is a number from 1 to m (m can be different each time).
I want to use javascript to get the number X of the respective element when somebody clicks one of these elements.
I realise I should probably use a class (.viewer) and and id (#x) containing the number. However, I am using a library to generate the html elements and I am stuck with this protocol and will have to make the best of it.
This is the javascript I have so far:
$(document).ready(function () {
$("#viewer>...").click(function () {
x = ...
var number = x;
});
});
What's missing in this code (indicated by 3 dots) is that viewer is not the full ID, but could be post-pended with something. I want to store whatever is after the clicked div in number, but I can't figure out which function to use for that.
Try this,
$("[id^='viewer_']").click(function () {
var number = this.id.match(/\d+$/)[0];
});
Why not use class to identify elements and then data-attribute for storing your id (data-id for example) and then get value of this data-attribute?
Otherwise I would personally use something like this
$(this).attr('id').substr("viewer_m".length);
Either split or a reg exp
var id = this.id.split("_m")[1]
or
var id = this.id.match(/\d+$/)[0];
or better yet, use a data attribute
<div data-mid="123">
and reference it
$("[data-mid]").on("click", function () {
var id = $(this).data("mid");
});
A better approach to this, as #Wax Cage mentioned, is to use classes and data attributes for better organizing. Example:
<div class="viewer" data-viewer-id="1">...</div>
$('.viewer').on('click', function() {
var viewerId = $(this).data('viewerId');
// ...
});

Change textbox value in javascript

I want to update the value of text box from where I'm getting initial value to add product to cart.
Now I'm applying round function & I want to update the value of text box that is because I'm using ajax & if I'm applying round function, user must know how system calculated everything.
Here's my simple code:
<script>
$(document).ready(function(){
$(document).delegate('.purchasenow','click', function(e){
var buynow=this;
var productid = $(this).attr('id');
var quantity = $('.quo_'+productid).val();
var quantity = Math.round(quantity);
alert(quantity); //This gives the value
$('.quo_'+productid).value = quantity; //This is not working
});
});
Can anyone tell why it's not working? It's very simple but I'm not able to find out the cause.
Have you tried
$('.quo_'+productid).val(quantity);
The jQuery selector returns a wrapped object, not the actual DOM element. I don't think wrapped object has the .value property
you are almost correct the only thing why it is not working because your syntax is wrong
this is the correct syntax for jQuery
$('.quo_'+productid).val(quantity);
if you want it in javascript
var txt = document.getElementById("quo_"+productid);
txt.value = quantity;

Value of selected list

I have a select list with dynamic content such
Honorar, 120.00
Porti, 7.50
Spesen, 12.00
This values are stored x_ko_leistungsart. I am selecting only one option (no multi selection) and would like to have the values after comma such 120.00 for Honorar and 7.50 if the the option porti is selected.
I am using the following function to get these values. unfortunately it does not work. I get only the value 10 assiged...
Could you please have a look to the code where the mistake can be?
Regards
thanks
mpol_ch
function SelectAnsatz() {
document.fkostenedit.x_ko_ansatz.value = '10';
var Ansatz=0;
var splitted;
var elements = document.getElementsByName("x_ko_leistungsart[]");
splitted = elements.nextSibling.nodeValue.split(",");
Ansatz = parseFloat(splitted[1]);
document.fkostenedit.x_ko_ansatz.value = Ansatz.toFixed(2);
}
Take a look at document.getElementsByName("x_ko_leistungsart[]");
I'll give you a hint: The "value" you're getting from that is not what you're expecting. You can reduce at least two lines of code by expanding on the getElementByName function.
You can find more information here: http://www.w3schools.com/dom/dom_nodes_get.asp
I solves my problem with an onchange even on x_ko_leistungsart. Here is the function:
Thanks
mpol_ch
function SelectAnsatz(){
var x=document.getElementById("x_ko_leistungsart");Ansatz=x.options[x.selectedIndex].text.split(",");
document.fkostenedit.x_ko_ansatz.value = Ansatz[1];
}

How can I convert to text I collect from these input fields to lower case in Javascript?

I am trying to convert any text that the user inputs in the following input fields to lower case how can I do that?
//collect the input fields
inputs = secWidget.getInputs();
inputs2 = secWidget2.getInputs();
You can use the toLowerCase function of javascript for that.
Assuming those methods return array of values, here is the most straightforward way to achive what you asked:
inputs = secWidget.getInputs();
for (var i = 0; i < inputs.length; i++)
inputs[i] = inputs[i].toLowerCase();
If still no luck please post more code and explain what getInputs return.
//collect the input fields
inputs = secWidget.getInputs().toLowerCase();
inputs2 = secWidget2.getInputs().toLowerCase();
Using toLowerCase string method in Javascript.
Reference:
http://www.w3schools.com/jsref/jsref_toLowerCase.asp
use:
inputs = secWidget.getInputs().toLowerCase();
you can use toLowerCase as mentioned above and toLocaleLowerCase() which in turn takes current locale of the user/host into account
As others have said, toLowerCase() will do what you want to do. However, I would also do this in code behind the scenes. You should always validate these inputs server-side, assuming this data is being processed in any way.
Users will always be able to disable javascript.

HTMLInputElement has no method 'val'

I'm looping through cells in a table row. each cell has a text box in it, and I want to take the value of the text box and push it onto an array.
function dothing() {
var tds = $('#'+selected+' td');
var submitvals = new Array();
tds.each(function(i) {
var val = $(this).children('input')[0].val();
submitvals.push(val);
});
}
Theres more to the function, but this is all that is relevant. For some reason, when I run this code, I get "HTMLInputElement has no method 'val'." I thought that input elements were supposed to have a val() method in jQuery that got the value so this makes no sense. Am I missing something, or doing it wrong?
val() is a jQuery method. .value is the DOM Element's property. Use [0].value or .eq(0).val()....
.val() is a jQuery function, not a javascript function. Therefore, change:
var val = $(this).children('input')[0].val()
To:
var val = $(this).children('input:eq(0)').val()
function dothing() {
var tds = $('#'+selected+' td');
var submitvals = new Array();
tds.each(function(i) {
var val = $($(this).children('input')[0]).val();
submitvals.push(val);
});
}
.val() is a jquery method. Using [0] returns the DOM element, not the jquery element
var val = $(this).children('input:first').val();
What I don't understand, is why none of the suggested syntaxes on this or other questions similar to this seem to work for me. I had to do trial and error and eventually had to use:
MySelectElement.value = x;
It also didn't help that the Visual Studio Intellisense suggestions offer a whole other range of unworking method names, such as ValueOf().

Categories

Resources