Toggling between states on 3 containers in jQuery
- by Saif Bechan
Hello, i have an php/mysql/ajax auction application application. Now there is a section that can have 3 states.
State one, the user can place a bid.(Bid button is shown)
State two, the user has to wait before he can place a new bid(number of sec is shown)
State three, the user has an auto bidding system enabled.(The price maximum and amount ate shown).
Now i get these values trough jquery ajax, and i want to present the user the right section. Now the code i have is as follows:
if(data[i].bidwait >= 0 && data[i].amount == ''){
// In this section the user has no autobiddings, and can place a bidding
$(productContainer+' .bid-wrapper').removeClass('none');
$(productContainer+' .bidwait-wrapper').addClass('none');
$(productContainer+' .autobid-wrapper').addClass('none');
}else if(data[i].bidwait < 0 && data[i].amount == ''){
// In this section the user has to wait the amount of sec to place a new bid
$(productContainer+' .bid-wrapper').addClass('none');
$(productContainer+' .bidwait-wrapper').removeClass('none');
$(productContainer+' .autobid-wrapper').addClass('none');
$(productContainer+' .bidwait-text').text(data[i].bidwait * -1);
}else{
// In the last section the user has the auto bidder enabled, so that is shown
$(productContainer+' .bid-wrapper').addClass('none');
$(productContainer+' .bidwait-wrapper').addClass('none');
$(productContainer+' .autobid-wrapper').removeClass('none');
$(productContainer+' .amount').html(data[i].amount == 0 ? '∞' : data[i].amount);
$(productContainer+' .maxprice').html(data[i].maxprice == 0 ? '∞' : data[i].maxprice);
}
This looks like an awful lot of code for something so small. I was wondering if there is an easier method to accomplish such a thing. Speed is a huge issue for me because this has to run every second in the users browser.
If there is no other option i am just going to remove this option and go with a no ajax approuch.
If you have been, thank you for reading!
