bp13
bp13

Reputation: 1

Jquery input[type=text] function check not working as expected when there is data with stopImmediatePropagation()

Currently I have a function that checks for a user click on a input[type=text] (css class name applied on that column is "OE_CARD" ) column. I want to check that this textbox contains input, then allow the user to continue, and if it doesn't have input, then allow them to either type input or select another column for the related row.

The nature of the question type will automatically trigger the next row to be shown if the user clicks the OE column even without entering input. So i've added "stopImmediatePropagation()" to prevent this from occuring.

Although now, even when the user does type input, it will just fire a warning asking the user to select a column (even though the OE column now has text in it).

What am I missing?

This is my function call:

$ ( ".sq-cardsort-bucket-c5" ).on( "click", function(e) {
  alert( "Handler for `click` called." );
  e.stopImmediatePropagation();
  setTimeout(dynamicOE,750);
} );

I have also tried the below to check for input:

$ ( ".sq-cardsort-bucket-c5" ).on( "click", function(e) {
  alert( "Handler for `click` called." );
  
  if ((.text-input).val().length > 0) {
      {e.stopImmediatePropagation(); return false}
  else{
      {e.stopImmediatePropagation(); return true}
  }
  
  setTimeout(dynamicOE,750);
} );

XML radio question for refernce:

<radio 
  label="Q1"
  cardsort:displayCounter="0"
  shuffle="rows"
  uses="cardsort.6">
  <row label="r1"><span class="blueRow">Blue</span></row>
  <col label="c5" open="1" openSize="25" randomize="0" ss:colClassNames="OE_CARD"> <span class="blueCol">Blue OTHER</span></col>
</radio>

Any help on what I am missing or have done wrong would be greatly appreciated. Or even a point in the right direction.

Upvotes: 0

Views: 62

Answers (1)

EthanSteel
EthanSteel

Reputation: 331

When you checked for the length of the text input you did not add the element class in quotes, and also forgot to use the dollar that specifies you choose an element here (.text-input).val().length, the updated code is $(".text-input").val().length

Upvotes: 0

Related Questions