ComboBox self-prompting component to join the no-check empty function

Source: Internet
Author: User

This title is very around the mouth, but this is also the result of a half-day, I am sorry to the PE teacher.

The title is to express: previously talked about using a ComboBox to implement their own proactive cue components. It is only now that the component is not able to hold data that does not exist in data.

The original idea was to infer through the onchange event. But helpless this function in its own active prompt mode, each change will trigger 2 times onchange event, too weird to give up.

And the onchange event is triggered every time the content in the ComboBox changes, and if the keyword input process, the event is triggered.

And the effect we want is to wait for the user to input the results again for verification, so does not meet the requirements.

Find API Discovery Combo provides an extension point for an Onhidepanel event that fires when its own active cue box is hidden.

The idea at the time was that the input box would certainly be hidden after it was entered, and that it would feel as if it was the mark of the completed input.

Tried, basically can meet the requirements. A little bit of a problem. Is the user high-speed input after clicking elsewhere. After the ComboBox loses focus, it is possible that even the input box is not displayed, what to talk about hidden?

Alas, there seems to be no perfect solution to this problem through the existing API, so just write it yourself. But my front-end level is really not good, blind J8 Tinker A version number, we make a look ~

$.extend ($.fn.combobox.methods, {completecheck:function (JQ) {var textbox = Jq.combobox (' textbox '); Console.log (JQ) Textbox.on (' Blur ', function () {setTimeout (' Docompletecheck ("' + Jq.selector + '") ', 200);//Here let some of the ComboBox's Operations Go})}); function Docompletecheck (selector) {var JQ = $ (selector), var value = Jq.combobox (' GetValue '); var json = Jq.combobox (' GetData '), if (!findinjson (JSON, value)) {Jq.combobox (' clear '); Jq.combobox (' Hidepanel ');}}

I added a new approach to the ComboBox: Completecheck

The main thing is to add a onblur event to the textbox in the ComboBox, which is the input component we entered.

The Docompletecheck function is triggered when the textbox loses focus. But first, let's run some of the ComboBox operations first.

So we're giving a 200ms delay, and then deciding whether or not to empty the input values in the ComboBox by comparing the existence in data

Add that, in fact, if the input is not in data. The value of the ComboBox (' GetValue ') will be undefined, so it can be inferred.

It can be used just like any other method that calls the ComboBox. $ (' #cc '). ComboBox (' Completecheck ');


ComboBox self-prompting component to join the no-check empty function

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.