We Keep Coding

Disable many fields by name javascript

This is my question:
I got an jsp page, this jsp has many text fields like this:
<html:text property="cicPF" maxlength="9" style="text-transform: uppercase;" onfocus="disableIfeFields()"/>
So I want to disable some of this text fields when the focus it's in a specific field
But no one of this fields has "id" label, and I can't modify it to include it.
May I disable the fields usig their given names, no one of this repeats the same name.
for example with a function like this:
function disableIfeFields(){
document.getElementsByName("numIdentificacionPF").disabled = true;
}
thanks

You need to loop through the list and disable all the fields you want that way, used input to show example:
function disableIfeFields() {
document.getElementsByName("numIdentificacionPF").forEach((e) => {
e.disabled = true;
});
}
<html:text property="cicPF" maxlength="9" style="text-transform: uppercase;" />
<input onfocus="disableIfeFields()" type="text" name="fname">
<input type="text" name="numIdentificacionPF">
<input type="text" name="numIdentificacionPF">
<input type="text" name="numIdentificacionPF">
<input type="text" name="numIdentificacionPF">
<input type="text" name="numIdentificacionPF">

Maybe like this:
function disableIfeFields(){
document.querySelectorAll('[property="cicPF"]')[0].disabled = true;
}
disableIfeFields();
<input type="text" property="cicPF" maxlength="9" style="text-transform: uppercase;" onfocus="disableIfeFields()"/>

Hopefully the following should help. Because the selection result is a list of elements you will have to loop through the results.
Please note that since you said no input repeats the same name, I'm using querySelectorAll, which might be a more suitable method after all…
var inputs = document.querySelectorAll('input[type="text"]');
for (var i = 0; i < inputs.length; i++) {
if (inputs[i].id === 'label') {
continue;
}
inputs[i].disabled = true;
}

How to get text-box counts in javascript

H i have a button "Add text" when on-click it creates the text-boxes,now How can i get the count of text-boxes in JavaScript i create text-boxes like
<input type="text" name="my_textbox[1]" id="my_textbox1" />
<input type="text" name="my_textbox[2]" id="my_textbox2" />
<input type="text" name="my_textbox[3]" id="my_textbox3" />
<input type="text" name="my_textbox[4]" id="my_textbox4" />
the reason why i need to count is ,i am fetching values from ajax and creating new text-box appending new text-box like :
<input type="text" name="my_textbox[5]" id="my_textbox5" value="seomthing"/>
Now I would like to know the number of text-boxes present. It would be best if I can get the count through JavaScript .
Thanks in advance.

Give your inputs a classname so you can identify them as a group:
<input class="myInputs" type="text" name="my_textbox[1]" id="my_textbox1" />
Then in your javascript select them with querySelectorAll() and look at the length of the returned collection:
var inputs = document.querySelectorAll('.myInputs')
var number_of_inputs = inputs.length

Use document.querySelectorAll() to get all the elements matching substring of id (https://www.w3.org/TR/selectors/#attribute-substrings). This '[id^="my_textbox"]' syntax means you are selecting all elements with id starting with "my_textbox" string. The just take the length of queried collection and you are done. Please see snippet below:
var textboxCount = document.querySelectorAll('[id^="my_textbox"]').length;
console.log(textboxCount);
<input type="text" name="my_textbox[1]" id="my_textbox1" />
<input type="text" name="my_textbox[2]" id="my_textbox2" />
<input type="text" name="my_textbox[3]" id="my_textbox3" />
<input type="text" name="my_textbox[4]" id="my_textbox4" />

Getting the number of unfilled empty text boxes in jQuery

I was trying to solve another person's jQuery question and ran into an issue of my own.
In order to solve this question, I need to determine the number of text boxes that are empty. I thought the best solution would be to use the element[attribute='value'] selector but that didn't work.
alert($("input[val='']").length);
I always get 0, even when there are 3 other empty text boxes. Empty text boxes should have a value equal to an empty string.
Here is my fiddle
http://jsfiddle.net/04gqaLog/
HTML
<input type="text" /></br>
<input type="text" /></br>
<input type="text" /></br>
<input type="text" />
jQuery
$(document).ready(function() {
var sum = 0;
var boxesFilled = 0;
$("input").on("change", function() {
sum += +$(this).val();
boxesFilled += 1;
alert($("input[val='']").length);
});
});

The first issue is you are referring to the value attribute as val. Those are considered two distinct attributes.
The next issue is some input elements may not have a value attribute. Therefore, you will need to specifically check for that or check if the value is falsey
var emptyInputs = $('input').filter(function() {
return !$(this).val();
});
console.log(emptyInputs.length);
$(document).ready(function() {
var sum = 0;
var boxesFilled = 0;
$("input").on("change", function() {
sum += +$(this).val();
boxesFilled += 1;
var emptyInputs = $('input').filter(function() {
return !$(this).val();
});
console.log(emptyInputs.length);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" />
</br>
<input type="text" />
</br>
<input type="text" />
</br>
<input type="text" />

Very Basic Math Script Using AJAX?

I wanna ask if is it possible to do very basic math inside form's input text field using AJAX? I know its possible with javascript/jquery but I don't want to having to clicking submit button and reload the page to see the result. I want the math calculation with instant result inside the input text field.
example:
Input Text Field 1 + Input Text Field 2 = (Shows Instant Result in Input Text Field 3)

You may do the following
http://jsfiddle.net/dharam1987/L9evdhkk/
Val 1 <input type="text" name="f1" id="f1" /> <br />
Val 2 <input type="text" name="f2" id="f2" /> <br />
Result <input type="text" name="res" id="res" /> <br />
<input type="button" value="Add" onclick="calculate();" />
<script>
function calculate() {
var f1 = parseInt(document.getElementById('f1').value);
var f2 = parseInt(document.getElementById('f2').value);
var res = f1 + f2;
document.getElementById('res').value = res;
}
</script>

You can do that using javascript/jQuery. Ajax has nothing to do with it. Use a change or keypress event.
This should give you the idea:
$("myInputSelector").on("keyup", function () {
var theTwoSelectors = $("myInputSelector"),
total = 0;
theTwoSelectors.each(function () {
var value = $(this).val();
if(value)
total += parseInt(value);
});
$("myResultSelector").val(result);
});

You can use this simple HTML
Lets try an Example for the above requirement
example:
We can simply use the tag
here the below output tag will show the result of input tag "a" value multiply by 5...
<form oninput="o.value = parseInt(a.value) *5">
<input type="number" id="a" name="a">
<output name="o" id="o"></></output>
</form>
more information please refer this link http://www.w3schools.com/tags/tag_output.asp

How to get the difference of two numbers from the input box without page submittal using Codeigniter?

I have three input boxes, of which two are for entering values (any number) and one is for getting results (the difference of the two). How can I get the result without using page submission using Codeigniter?

You can use jQuery for that.
<input type="text" id=first" name="firstInput" />
<input type="text" id="second" name="secondInput" />
<input type="text" id="third" name="thirdInput" />
//jquery
$(document).ready(function() {
var first = parseInt($("#first").val(), 10);
var second = parseInt($("#second").val(), 10);
var thirdVal = first - second;
$("#third").val('');
$("#third").val(thirdVal);
});
Hope it helps

without exactly knowing how the result is being called you could use on onblur on the second number input/ first.
<input name="number" id="num_0" type="text" />
<input name="number" id="num_1" type="text" onblur="getResult()" />
<input name="number" id="num_2_result" type="text" />
script to get result derived for num_0 and num_1
function getResult(){
var number = document.getElementsByName('number');
var result = parseInt(number[0].value,10) - parseInt(number[1].value,10);
// if is a number display reuslt
if(!isNaN(result)){
number[2].value = result;
}
}