jQuery Forum

unable to submit form after a condition is true
[5Replies]
- 11-Aug-2016 05:59 AM
- Forum: Using jQuery
Hi,
I have the following code, but I am able to prevent the form submit when the qty is less than the min bid amount but unable to submit the form when the qty is greater than min bid.

first time if input qty with a lesser value and then input the qty value greater than min_bid then the form is unable to submit.

If I input qty value greater than min_bid amount in the first time then I am able to submit the form

Please help
2. <form class="form-inline" method="post" id="auctionform" action="<?php echo base_url(); ?>orders/create">
3. <div class="form-group" id="bid_tab">
4. <label class="fee_text" for="registration_fee">Registration fee</label>
5. <label class="money_symbol " for="registration_fee">₹</label>
6. <label class="fee" for="registration_fee"><?php echo $content->starting_bid; ?></label>
7. <input type="hidden" name="amount" value="<?php echo $content->starting_bid; ?>" >
8. <input type="hidden" name="exp_id" value="<?php echo $content->id; ?>" >
9. <input type="hidden" name="exptype" value="<?php echo $content->exptype; ?>" >
10. </div>
11. <div class="form-group" id="bid_tab">
12. <label class="sr-only" for="exampleInputAmount">Amount (in dollars)</label>
13. <div class="input-group">
14. <div class="input-group-addon">₹</div>
15. <input type="text" class="form-control btn-block" id="qty" name="qty" placeholder="Amount">
16. <div class="input-group-addon" style="padding-left: 35px; padding-right: 35px;">MINIMUM NEXT BID ₹ <?php echo $qty; ?></div>
17. </div>
18. </div>
19. <br>
20. <div class="col-md-12 form-group">
21. <div class="checkbox">
22. <label><br><br>
23. <input id="agree" type="checkbox" checked> I Accept all terms and conditions
24. </label>
25. </div><br><br>
26. 
27. <?php if(isset($_SESSION['user_type']) && ($_SESSION['user_type']=="client")){ ?>
28. <button type="button" id="make_payment" class="btn btn-default btn-block">MAKE PAYMENTS</button>
29. <?php }else{ ?>
30. <a href="#" id="bid_btn" class="text-uppercase btn btn-default btn-block" data-toggle="modal" data-target="#myModal_login">Login to Buy </a>
31. <?php } ?>
32. </div>
35. </form>
40. 
43. <script>
44. $(document).ready(function(){
46. $("#make_payment").on("click", function(event) {
48. var qty=$("#qty").val();
49. var min_bid=5200;
50. alert("qty="+qty + " "+ "min bid="+ min_bid);
51. if(qty > min_bid)
52. {
53. alert("bid amount is greater");
55. $("#auctionform").submit();
57. }
58. else if(qty < min_bid){
59. alert('Bid amount cannot be less than next bid amount');
60. $("#auctionform").submit(function(event) {event.preventDefault();});
61. }
63. });
65. });
66. </script>
I am not sure where I am missing something.

Please help.

How to use recursion along with setInterval
[1Reply]
- 28-Dec-2015 03:29 AM
- Forum: Using jQuery
Hi Everyone,

My objective is to

Request a database call

STEP 1: if record is present then display the modal for five seconds

while closing the modal

again request a database call when the modal closes and repeat (STEP 1:)

STEP2: if no record is present then request a database after every 2 seconds

Below is the code I have tried and various other, but the problem is after the STEP1 is completed for say 4 records after call of these 4 records there is again a database call with all the four records all together and this calls (all 4 ) are repeated which should be only once after 2 seconds

Please help, TIA

$(document).ready(function(){

//the id would be for the Unit ID along with services of that unit

//var id="<?php echo 1; ?>";

var id=1;

isopen=$('#myModal').hasClass('in');

if(isopen==true)

{

console.log("MODAL is open");

}

else

{

var mytimer=setInterval(function(){

call_popup(flag="from top call popup");}

,5000);

console.log("Initalising the time value is"+mytimer);

}

function call_popup(flag)

{

$.post('<?php echo base_url(); ?>display/get_popup', {id : id}).done(function(datareg) {

var jd=jQuery.parseJSON(datareg);

//id=0 is returned if there is no record

if(jd.id==0)

{

if ( typeof mytimer !== "undefined" && mytimer) {

clearInterval(mytimer);

}

setTimeout(function(){call_popup(flag="calling from settimeout after 3 seconds");}, 3000);

}

else

{

$("#myid").val(jd.id);

if ( typeof mytimer !== "undefined" && mytimer) {

clearInterval(mytimer);

}

var id=jd.id;

$("#myModal").modal('show');

//

setTimeout(function() {

$('#myModal').modal('hide');

$('#myModal').on('hidden.bs.modal', function () {call_popup("from recursion");});

}, 5000);

}

});

}//end of popup function

});

Unable to make this searchable dropdown plugin work
[11Replies]
- 09-Sep-2015 09:15 AM
- Forum: Using jQuery Plugins
Hi,
I am using <select> element where the data comes from database and using https://github.com/alxlit/bootstrap-chosen this for searchable dropdown.

It works fine with the <select> when present on the page.

Now my problem is the <select> element is being generated dynamically with jquery and the data list coming from database is also being inserted through ajax and the Chosen plugin does not work for this.

Is there any way I can get it working? or any other plugin suggestion?

below is the code for generating dynamic <select> and inserting the datalist for the values/option in dropdown

First dropdown is hardcoded html and the rest are generate with the below code

var newTextBoxDiv = $(document.createElement('div'))

.attr("id", 'TextBoxDiv' + counter);

newTextBoxDiv.after().html('<div class="row"><div class="col-lg-1"><table><tr><td><a data-toggle="popover" id="iconimg'+ counter + '" data-placement="right" class="btn btn-xs" data-pimg="0"><img src="qicon.png" width="20px" height="20px"> </a></td> <td><a data-toggle="modal" class="btn btn-default btn-sm btn-beta" id="history'+ counter + '" ><strong>H</strong></a></td> </tr></table></div><div class="col-lg-5"><select name="item_id[]" id="item_id' + counter + '" class="form-control input-sm chosen-select "></select></div>' + ' ' + '<div class="col-lg-2"> <input type="text" class="form-control input-sm" name="qty[]" autocomplete="off" id="qty' + counter + '" value=""></div>' + ' ' + '<div class="col-lg-2"> <input type="text" class="form-control input-sm" name="price[]" id="price' + counter + '" value=""></div>' + ' ' + '<div class="col-lg-2"> <input type="text" tabindex="-1" class="form-control input-sm" readonly name="amount[]" id="amount' + counter + '" value=""></div> </div>');

newTextBoxDiv.appendTo("#TextBoxesGroup");

counter++;

// for populating the slect box the select

$.post('result.php', function(data){

//$('[id^=item_id]').html(data); });

$('#item_id'+(counter-1)).html(data); });

//END for populating the slect box the select

});

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

if(counter==2){

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 + " : " + $('#store_value' + i).val();

msg += "value #" + i + " : " + $('#display_text' + i).val();

}

alert(msg);

});

$("#element_type").change(function(){

var type1= $(this).val();

if(type1==3){$(".dynamic").hide("slow"); } else {$(".dynamic").show("slow");}

});

});

Thanks for any help.

No event is generated on dynamically generated DOM elements
[2Replies]
- 20-Jul-2015 12:05 AM
- Forum: Using jQuery
Hi,

I am generating various DOM elements using ajax and inserting into a div with

Dynamically generated element

<button class="mybtn" id="1">Btn1</button>

<button class="mybtn" id="2">Btn2</button>

Div into which I am inserting the elements

<div class="col-md-12" id="displayslots"> </div>

When i use this below code no click event gets fired :( , please help

$(document).ready(function() { $(". mybtn ").on("click", function(){

var id=$(this).attr('id'); alert(id);

}); });

Thanks for help in advance

How to get the value of dropdown list generated dynamically
[2Replies]
- 07-May-2015 02:24 PM
- Forum: Using jQuery
Hello,

First row of input fields are manually put in html

the rest of the rows are generated dynamically by clicking add options

(the values of the combox box is also coming from database through ajax from second row onwards)

When I select the first row combo box - I am able to get the values of selected item and its price is fetched through ajax call and inserted into the nex text box.

My problem is that when I select the second, third etc row's combo box I am not able to generate the values of the selected item

The code I am using is :

$('[id^=item_id]').on('change',function(){

// I have also tried $('[id^=item_id]').'change(function(){

var role=$(this).val();

var element_id=$(this).attr("id");

var eid=element_id.substr(7);

$.post('get_price.php',{item_id:role},function(data){

$('#price'+eid).val(data);

});

});

Please help me with this.

Thanks

Using ajax not able to remove class immediately after adding class
[2Replies]
- 30-Dec-2014 01:10 PM
- Forum: Using jQuery
I have this piece of code

$(document).ready(function() {

$(".spam").on("click", function(e){

//var pid=$(this).attr('id');

//var fav_btn=$(this).attr('id');

var site_root="http://localhost/startup/msg";

$path=$(location).attr('href');

$.ajax({

url:site_root +"/insert_spam.php",

type:"POST",

data:{ 'path':$path},

'success':function($result)

{

// alert($result);

if($result=="suc")

{

$(".spam").removeClass('spam').addClass('reported_spam');

}

else if($result=="err") { alert("Not able to report to admin. Please contact admin");}

},

// 'error':function($e){ alert($e);}

});

return false;

});

});

========================================================

$(document).ready(function() {

$(".reported_spam").on("click", function(){

var site_root="http://localhost/startup/msg";

$path=$(location).attr('href');

$.ajax({

url:site_root +"/insert_spam.php",

type:"POST",

data:{ 'path':$path},

'success':function($htm)

{

//alert($htm);

if($htm=="suc2")

{

//$(".social span.reported_spam").removeClass('reported_spam').addClass('spam');

$('span.reported_spam').removeClass('reported_spam').addClass('spam');

// e.stopPropagation();

}

else if($htm=="err2") { alert("Not able to report to admin. Please contact admin");}

}

});

return false;

});

});

========================== html ============================

<span class="glyphicon glyphicon-ban-circle spam pull-right "></span>

STEP1. when I click on spam button it is working fine it updates the database and adds the ".reported_spam" class and removes ".spam" to the span tag and changes the color

STEP2. but immediately after this if I click again it does not removes the ".reported_spam" class and adds".spam" class even though database is updated

But if after STEP 1. if I refresh the browser and then click again it add the spam class and removes the reported_spam class.

But I want to do Step2 without refreshing the browser.

Any help is appreciated.

Thanks,

Amit

how to limit the number of selection in auto complete?
[1Reply]
- 27-May-2013 10:37 PM
- Forum: Using jQuery UI
Hello friends,

Is there any way to restrict the number of selection in multiple auto complete jquery widget.

For example we are able to select multiple items from the auto complete list, but how do I restrict the number say 3, so that I should be able to select only three items from the list and should not be able to enter anything beyond this.

I hope my question is clear.

Thanks for any help.

Regards,
Amit

How to add a background image in css when it already has a background image
[5Replies]
- 14-Feb-2013 11:13 PM
- Forum: Using jQuery
Hello Friends,

This is my HTML

<li id="myemail" class="myemail"> <a href="a.php">TEXT</a></li>

CSS
.myemail{ background-image:url(/hcj/images/email1.png); background-repeat:no-repeat; }
.myemail:hover{ background-image:url(/hcj/images/email2.png); background-repeat:no-repeat; }
.myemail3{ background-image:url(/hcj/images/email3.png); background-repeat:no-repeat; }

Jquery Code

$('#myemail').removeClass('myemail').addClass('myemail3');

$('.myemail').css('background-image','url('+ /image/email3.png +')' );.

I am trying two jquery way of changing the background image when a certain condition is met in php i.e.

I am trying to remove a class and add another class

OR

I change the css background image

but neither of them are working for me, please help me as to where am I going wrong.

Thanks in advance.....

how to put the animated spinning graphic for autocomplete
[1Reply]
- 15-Jan-2013 12:20 AM
- Forum: Using jQuery UI
Hello friends,

I am using autocomplete with remote data source, every thing works fine , but I am not able to put the spinning graphic inside the textbox, as seen in the demo of jqueryui autocomplete widget.

Please help how can I put that graphic inside the textbox.

Thanks for any help.....

I just started using jquery
[5Replies]
- 29-Oct-2012 11:57 AM
- Forum: Using jQuery
I have this code which works for ver 1.4x but does not work for latest version is there any thing I am missing out or there is some problem in jquery....
- there is no focus on tabindex 0
- error message in class error does not shows up when the input text blurs out
- only line working is $('.error').css('display','none');
$(document).ready(function(){

$('.error').css('display','none');
$('input:[tabindex="0"]').focus();

$('.req').each(function(){

$(this).blur(function(){
var da=$(this).val();
var len=da.length;

if(len<1)
{
$(this).next('.error').show();
$(this).focus();
}
else
{
$(this).next('.error').hide();
}

});

});

});

help reqd in accordion and tabs
[1Reply]
- 28-Aug-2011 12:06 PM
- Forum: Using jQuery UI
i have made a tabs using the ui library and there are three tabs say, birds, animals , and human
Now inside i am trying to make 2-3 accordion inside each tab.

i have created the accordion inside birds and it is working fine,
but when i am creating accordion inside animals the accordion are being created but the contents are not being displayed.

what could be the problem , i am not sure, please help.

thanks in advance.

Response title

Attachments

jQuery Forum

Activity Trend