Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Detect texbox clear-event in IE. How do I clear the input type="text" (textbox) in IE (Internet Explorer) when IE-specific clear-box is clicked?

In Internet Explorer, there is a little x-like button is shown, when you start typing in the textbox. How do I detect the event when this icon is clicked on? Is there an event-type?

<input type="text" value ="" id ="qsearch" name="qsearch"
    onBlur="qsearchLookup(this.value);" OnClick="qsearchLookup(this.value);"
    onkeyup="qsearchLookup(this.value)"  size="26">

function qsearchLookup(searchVal){
    document.getElementById("qsearch").value="";
}

enter image description here

like image 520
Andrew Avatar asked Apr 06 '13 00:04

Andrew


2 Answers

I do not know about special event for this small x-like button, and I don't think that it exists, but you can use input event (oninput="qsearchLookup(this.value)" in your case) to catch this change.

like image 50
outcoldman Avatar answered Nov 20 '22 01:11

outcoldman


Am not sure, if still someone is looking for a solution. Unfortunately there is no event handler available for the clear(X) icon, however below code snippet/tricks worked for me. CSS to complete hide the clear(X) icon and if you don't want to hide the clear(X) icon but need to handle then JS code snippet would help.Verified in IE 8,9,10,11 and it works fine

CSS trick:

#textFieldId::-ms-clear {display: none;} -- For a particular text field

or

input[type=text]::-ms-clear { display: none; } -- for all text fields in scope

OR

JavaScript trick (to reset the text field value to empty/blank and fire the html event KeyUp. Accordingly you can change per your need)

$('#textFieldId').bind("mouseup", function() {
        var $input = $(this);
        var oldValue = $input.val();
        if (oldValue == "") {
            return;
        }
        setTimeout(function() {
            var newValue = $input.val();
            if (newValue == "") {
                $input.trigger("keyup");
            }
        }, 1);
    });
like image 8
Sunil Kumar Das Avatar answered Nov 20 '22 01:11

Sunil Kumar Das