Jump to content

Trying to get auto complete with radio button


pacesenthil

Recommended Posts

The drop-down doesn't disappear once switched from one selected option to the next option

For instance if click of Radio button main group the drop down display now again clicking of country its also displaying but if i click subgroup ,main group drop down is not clearing and if i click item group ,subgroup and main group is not clear

<script>(function ($) {$.widget("custom.combobox", {_create: function () {this.wrapper = $("<span>").addClass("custom-combobox").insertAfter(this.element);this.element.hide();this._createAutocomplete();this._createShowAllButton();},_createAutocomplete: function () {var selected = this.element.children(":selected"),value = selected.val() ? selected.text() : "";this.input = $("<input>").appendTo(this.wrapper).val(value).attr("title", "").attr("id", "sss").addClass("custom-combobox-input ui-widget ui-widget-content ui-state-default ui-corner-left").autocomplete({delay: 0,minLength: 0,source: $.proxy(this, "_source")}).tooltip({tooltipClass: "ui-state-highlight"});this._on(this.input, {autocompleteselect: function (event, ui) {ui.item.option.selected = true;this._trigger("select", event, {item: ui.item.option});},autocompletechange: "_removeIfInvalid"});},

Reference the link http://jsfiddle.net/dvx53/26/

Edited by pacesenthil
Link to comment
Share on other sites

I remember, quite vaguely, what you wanted to do with this, very vaguely... Not sure exactly what you've intended to have done but I've written up my own version. In any case like before, I think you're trying to over complicate things with an excessive amount of redundant inputs.

 

http://jsfiddle.net/7NNvX/

 

take a look at my attempt at your problem, I removed a lot of redundant code and moved away from the confusing table setup you had. Again its a little difficult to solve your problem, however, as I'm unsure exactly what you want.

Link to comment
Share on other sites

Thank for reply and effort .Now User can click any two Radio button by this combination ...so now two list box will appear.In my project i will customize by ID or NAME Only.In previous thread i had take it by ID.
Here i want to do two point
1.One is to show/hide a combo box with auto complete by clicking of radio button by hiding a default select box .
2.if it Select box contain Null value or Empty Value Remove that Value.
I hope u will understood.Kindly help on this by Using ID or Name only...
My Requirement:
**(Main Group and Country)or(Main Group and Zone)or(Main Group and State) or(Main Group and City)or(Main Group and Area Manager)or(Main Group and Outlet)                                                                                   **(Sub Group and Country)or(Sub Group and Zone)or(Sub Group and State)or (Sub Group and City)or(Sub Group and Area Manager)or(Sub Group and Outlet)          **(Item Name and Country)or (Item Name and Zone) or(Item Name and State) or (Item Name and City)or(Item Name and Area Manager)or(Item Name and Outlet)

 

Edited by pacesenthil
Link to comment
Share on other sites

Thanks for reply.Here is my code and screen shot ...In screen-shot all drop down all are visible i don't want that in on-load it have to be hide and click of Radio button drop-down want to display with auto complete but here i had click of Maingroup and country but it had dispalyed a default listbox i dont want that ..it have to hide and display a jquery dropdown with auto complete and Null Value wants to remove if it contain and it have to be do by only ID OR NAME

auto.html

post-169284-0-79351100-1392456174_thumb.png

Edited by pacesenthil
Link to comment
Share on other sites

here is a link to the previous thread on the topic so that others can be brought up to speed. in that thread I posted a fiddle that I thought would solve your problem but I noticed I didn't actually explain my reasoning why I think it would. I'll start by asking a question.

 

Why do you need 9 select boxes? from what I understand every time you select a radio button you want to delete whatever was chosen in a related select box so that you can change another select box. when you submit the form, the server is gonna see 18 different inputs (9 radio inputs and 9 select inputs). however you seem to only want 4 of those inputs, the 2 radios and the 2 selects (well we can actually reduce that to just the 2 selects since the radios are also redundant).

 

In the fiddle I provided in that previous thread, I looked at your problem and saw that your process involved over complicating on both the client and server side. client had to mess with all this convoluted logic just to make sure all these select boxes wouldn't have values that would confuse the user or server. while the server side had to sift through 18 different inputs when all it really needed was just 2 of them. so what I did was state that there is only 2 select boxes, and whenever you clicked on a radio button javascript would completely destroy one of the select boxes and rebuild it on-the-fly, the old values don't matter (your requirements made a point of trying NOT to remember previous selections). Not only did this simplify your hundred or so lines of client-code into about 20, but it also greatly simplified the server's job, as now it doesn't need to sift through 18 inputs to get what you want. it can completely ignore the radio inputs and look at the only 2, not 9, select boxes that were submitted.

 

Fixing that 1st I believe is more important as it makes all your future work easier, as well as solve your current problems. I also made minor updates with autocomplete in the other fiddle with the combo box widgets. but those should be ignored until the actual html is rewritten (as its possible that much of the code is unnecessary).

Link to comment
Share on other sites

first of all thanks for u r reply ..As of Old thread i came up for clear a previous value it had been worked perfectly by setting null.so in this thread my problem is to remove NULL Value if select box contain and other one is to hide a default Select box and display Jquery UI select box with Auto complete function when combination of Radio button click as mention by above post Using only by ID OR NAME of element

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...