CODEWITHSUNDEEP
javascriptjqueryhtmlinternet-explorerfirefox
Christophe Sophy
Christophe Sophy

Reputation: 76

Textbox within a CheckBox value, desactivate unchecked when I type into the TextBox

I generate a Textbox within my Checkbox value. But when I click into the textbox in order to type in something, the checkbox automatically unchecked itself.

<span id="TRAVEL_TYPE_1"><input id="TRAVEL_TYPE_0" type="checkbox" onclick="UpdateTravelInformations();">
    </input><label for="TRAVEL_TYPE_0">
  TRP1 : Transports en commun 2ème classe, sur justificatifs
  <div id="TRAVEL_TYPE_1_INFORMATION" class="infoChoixFDM" style="display: block;">
     <input id="MONTANTMAX" class="positive-integer" type="text" value="20" maxlength="5" style="width:50px; text-align:center" runat="server"></input>
   €
  </div>
 </label>
</span>

The problem is partially solved on Chrome, when I set checked as false on the click event of MONTANTMAX. But in IE and Firefox it doesnt work...

$('#MONTANTMAX').click(function () {
    if (!$.browser.msie) {
        $('#TRAVEL_TYPE input').get(0).checked = false;
}

Can someone help me ?

Upvotes: 1

Views: 220

Answers (2)

Spokey
Spokey

Reputation: 10994

You have to close the <label> at the end on the text

<span id="TRAVEL_TYPE_1"><input id="TRAVEL_TYPE_0" type="checkbox" onclick="UpdateTravelInformations();">
    </input><label for="TRAVEL_TYPE_0">
  TRP1 : Transports en commun 2ème classe, sur justificatifs</label>
  <div id="TRAVEL_TYPE_1_INFORMATION" class="infoChoixFDM" style="display: block;">
     <input id="MONTANTMAX" class="positive-integer" type="text" value="20" maxlength="5" style="width:50px; text-align:center" runat="server"></input>
   €
  </div>
</span>

Otherwise the input will be assigned as a label for the checkbox.

UPDATE: JS solution

$(function(){
  $('#MONTANTMAX').click(function (e) {
    e.preventDefault();
    $('#TRAVEL_TYPE_0[checked=false]').prop('checked', true);
  });                                             
});

Upvotes: 3

Chris Dixon
Chris Dixon

Reputation: 9167

Your code is a little bit muddled, by the looks of things.

Try this:

$('#MONTANTMAX').click(function () {
    $('#TRAVEL_TYPE_0').prop('checked', true);
}

Upvotes: 0

Related Questions