How to make simplier the jquery code

Question

Aim is to detect if after page load input values are changed.

Input fields (19 fields) for example

<input type="text" name="date_day1" id="date_day1" value=" >
<input type="text" name="date_month1" id="date_month1" value=" >
<input type="text" name="date_year1" id="date_year1" value=" >
<input type="text" name="amount1" id="amount1" value=" >

Then hidden input field like this

<input type="text" name="is_row_changed1" id="is_row_changed1" value="">
<script>

$("#date_day1").on("change", function () {
    document.getElementById('is_row_changed1').value = 1;
});

$("#date_month1").on("change", function () {
    document.getElementById('is_row_changed1').value = 1;
});

</script>

If in any of input fields (19 fields) value is changed, then I need to reflect it in this hidden input field (I decided to set the hidden input field value to 1).

After that ajax with php where I check if the hidden input field value is 1. If 1, then update mysql. Aim is to reduce usage of server resources.

Question Javascript code for the hidden input field would be long. May be some way (code) to make is shorter (simplier)?

$('#is_row_changed1').val(1); Do you have 19 input fields and 19 hidden fields. Do you need to update hidden_field_1 if input_1 is changed and so on? — Quicksilver
– Quicksilver, Commented Apr 17, 2013 at 7:20
I have 19 input fields and only 1 hidden field. If any of 19 input fields value is change I must set the 1 hidden field value to 1. I changed $("#date_day1").on("change", function () { document.getElementById('is_row_changed1').value = 1; }); to $("#date_day1").on("change", function () { $('#is_row_changed1').val(1); }); and does not work — user2232696
– user2232696, Commented Apr 17, 2013 at 7:29

Shawn Balestracci · Accepted Answer · 2013-04-17 07:21:57Z

5

Add a row_changed class to each input then you can target them all with one call:

$(".row_changed").on("change", function () {
document.getElementById('is_row_changed1').value = 1;
});

(you can also simplify it even more with QuickSilver's comment.)

answered Apr 17, 2013 at 7:21

Shawn Balestracci

7,5601 gold badge37 silver badges53 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Pablo Francisco Pérez Hidalgo · Accepted Answer · 2013-04-17 07:29:00Z

1

You could use JQuery selectors in order to set the same "input changed" callback for all input elements declared in your HTML code:

var anyFieldChanged = false; //Global variable
function changedCallBack()
{
  anyFieldChanged = true;
  alert('Fields changed');
}

allInputs = $('input');
allInputs.each(function() { this.onchange = yourCallBack(); });

answered Apr 17, 2013 at 7:29

Pablo Francisco Pérez Hidalgo

27.8k8 gold badges40 silver badges64 bronze badges

Comments

Hannes Johansson · Accepted Answer · 2013-04-17 07:29:29Z

1

I don't know if it's just in your example code, but you have several elements with the same ID, which is not valid. Each ID should be unique (which is the purpose of any ID). You can either add a class to each input you want to track and select on that like Shawn said or if you want to track every input except the hidden on the page you can use

$("input:[type!=hidden]").on("change", function () {
    document.getElementById('is_row_changed1').value = 1;
});

answered Apr 17, 2013 at 7:29

Hannes Johansson

1,8022 gold badges16 silver badges28 bronze badges

Comments

Bharat Chodvadiya · Accepted Answer · 2013-04-17 07:40:09Z

0

Use like this.

<script>
$("#date_day1").on("change", function () {

  $('#is_row_changed1').val(1);

});

$("#date_month1").on("change", function () {

  $('#is_row_changed1').val(1);

});

// etc
</script>

answered Apr 17, 2013 at 7:40

Bharat Chodvadiya

1,6484 gold badges20 silver badges31 bronze badges

Collectives™ on Stack Overflow

How to make simplier the jquery code

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related