CODEWITHSUNDEEP
javascriptjquery
Smudger
Smudger

Reputation: 10771

jquery javascript - clear checkboxes on changing autocomplete field

I have the below script:

$("#product1").autocomplete({
     source: "get_sku_family",
     messages: {
         noResults: '',
         results: function () {}
     },

     select: function (event, ui) {
         var selectedObj = ui.item;

         $.post('get_as_09', 
             {
                 data: selectedObj.value
             }, 
             function (result) {
                 if (result[0] > 0) {
                     $('#h09_1').attr('checked', 'checked');
                 } else {
                     $('#h09_1').removeAttr('checked');
                 }
             }
         });
     }
});

This has an autocomplete field that when text is entered provides options from a database. this works. then on clicking an option from the autocomplete, it queries the database with a function(get_as_09) and checks the checkbox based on the result.

Again this works 100%.

What I do want to change though, is that when I enter a new value on the autocomplete, it must clear the checkboxes before applying the new database lookup logic to check the boxes.

I just don't know where to add the $('#h09_1').removeAttr('checked');

Thanks and Regards...

any help appreciated

UPDATE Ripu

if(data:selectedObj.value.length ==0 ){$('#h09_1').removeAttr('checked');};
 $.post('get_as_09', {data:selectedObj.value},function(result) { 

      if(result[0] > 0) {
          $('#h09_1').attr('checked','checked');
       } else {
          $('#h09_1').removeAttr('checked');
      }
 });

Upvotes: 0

Views: 257

Answers (5)

cwebbdesign
cwebbdesign

Reputation: 41

What if you attach an event listener on the element based on the keypress event? Something like this:

$(selectedObj).one('keypress', function (e) {
    var checkbox = $('#h09_1');

    if (selectObj.val().length > 0) {
        checkbox.attr('checked', false);
    }

});

This way you know somebody is typing in the field before you clear it. You could bind the event listener after each database lookup. Just an idea.

Upvotes: 0

wm.p1us
wm.p1us

Reputation: 2059

what if you put before

   $.post('get_as_09', {data:selectedObj.value},function(result) {

so everytime before you put smth inside your $('#h09_1') you clean it?

Upvotes: 0

shishirmk
shishirmk

Reputation: 425

Why dont you clear your checkboxes on focus of the auto-complete field.
Here is the documentation about this event http://api.jqueryui.com/autocomplete/#event-focus

as you said just a $('#h09_1').removeAttr('checked'); should suffice.

focus: function( event, ui ) {
    $('#h09_1').removeAttr('checked');
}

Upvotes: 0

Faryab
Faryab

Reputation: 1

try to make it on texbox on change event means when you enter the new value in auto complete make it there to clear any thing you want check

Upvotes: 0

ripu1581
ripu1581

Reputation: 300

before this line

$.post('get_as_09', {data:selectedObj.value},function(result) {

check if the value of data:selectedObj.value is empty. If it is empty, then you don't need to make a post request, just simply uncheck the checkbox

Upvotes: 1

Related Questions