Jump to content

Recommended Posts

Hey guys im new to jquery and just trying to do summin. i want it to count the amount of fields its adding and when it has reached a set number it will stop (Temp display an alert) here is what i have:

 

$('#add').click(function(){
	var i;
	if(i == 3){
		alert("Max number of fields have been added!");
	}else{
		$('#clone-field').clone(true).insertBefore('#clone-field');
		i++;
		return true;
	}
});

 

what am i doing wrong guys ? hope someone can help.

 

Thanks!

Link to comment
https://forums.phpfreaks.com/topic/219320-jquery-variable-increment-help/
Share on other sites

Well, I'm not sure what the context of your code is but here's a start on what I think you need to know:

 

$(element name).each(

    function(index){

          if(index==3){

              //do something if the current iteration = 3

          }

    }

);

 

.each in jQuery is a way to iterate through all the elements that have the element name you have assigned in the selector:

http://api.jquery.com/each/

 

 

Hi Johny,

In your case no need of "each". I answer Your Question Through an Example , pls Copy paste my Following Code and Run , You'll understand

How to Increment Variable.....

<html>
<head>
<title>jQuery add / remove textbox example</title>

<script type="text/javascript" src="jquery-1.3.2.js"></script>

<style type="text/css">
div{
	padding:8px;
}
</style>

</head>

<body>

<h1>jQuery add / remove textbox example</h1>

<script type="text/javascript">

$(document).ready(function(){

    var counter = 2;

    $("#addButton").click(function () {

if(counter>10){
            alert("Only 10 textboxes allow");
            return false;
}   

var newTextBoxDiv = $(document.createElement('div'))
     .attr("id", 'TextBoxDiv' + counter);

newTextBoxDiv.after().html('<label>Textbox #'+ counter + ' : </label>' +
      '<input type="text" name="textbox' + counter + 
      '" id="textbox' + counter + '" value="" >');

newTextBoxDiv.appendTo("#TextBoxesGroup");


counter++;
      alert("current Counter:"+counter);
     });

     $("#removeButton").click(function () {
if(counter==1){
          alert("No more textbox to remove");
          return false;
       }   

counter--;

        $("#TextBoxDiv" + counter).remove();

     });

     $("#getButtonValue").click(function () {

var msg = '';
for(i=1; i<counter; i++){
   	  msg += "\n Textbox #" + i + " : " + $('#textbox' + i).val();
}
    	  alert(msg);
     });
  });
</script>
</head><body>

<div id='TextBoxesGroup'>
<div id="TextBoxDiv1">
	<label>Textbox #1 : </label><input type='textbox' id='textbox1' >
</div>
</div>
<input type='button' value='Add Button' id='addButton'>
<input type='button' value='Remove Button' id='removeButton'>
<input type='button' value='Get TextBox Value' id='getButtonValue'>

</body>
</html>

 

Pls Include jQuery there !!!  be happy and happy Coding....

 

Bye Anes  ::)

 

var myvar = 1;
$('#add').click(function(){
      if(myvar == 3){
         alert("Max number of fields have been added!");
      }else{
         $('#clone-field').clone(true).insertBefore('#clone-field');
         myvar++;
         return true;
      }
   });

You need to set the counter outside your function call, or it will be reset to zero each time the function is called.

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.