emkaydk / jstepper Goto Github PK

Using this: $('#txtTesting').jStepper({minValue:23, maxValue:230, minLength:3});

User intends to type 100.

They press 1. The stepper automatically jumps to 23?

Are there any ways to control this behavior and allow the user to type 100? Thank you.

Is it possible to prevent entry that overflows minLength from resenting the control to maxValue?

In a scenario like this:
Stepper({minValue:1, maxValue:999, minLength:3});
I can see a user entering say "1111" when they meant to type "111" and saving without noticing and they've saved a "999" instead.

Would be nice if the value just stops at "111" if they go past the allowed length.

Thoughts?

Researching using this widget as part of a larger timecode editing widget (e.g. 10:23:43.505 would be ten hours, twenty-three minutes, forty-three seconds and 505 milliseconds). I would use three of your widgets (for hours, minutes, and seconds inputs) and use textnodes for the colons between the hours and minutes inputs.

When the user is focused on the hour field and hit ":", I want to change focus to the minutes field. Suggestions for how to handle this case? It looks like your plugin does not provide a hook for this use case (which would be completely understandable). Just looking for guidance.

If I set maxValue to 100 and overflowMode to 'ignore', supposedly when I type 111, it will revert to 11 but the value changes to 100 (maxValue). Is it by design?

Create a more visible and official link to the github project on the documentation site.

Can I dynamically change the min and max values after instantiation? Could you provide an example?

When the minimum value is of 500 and a user wants to input 2000 the text box value changes to 500 immediately.

Issue found at
http://stackoverflow.com/questions/39995788/jquery-jstepper-time-delay-on-key-up

For example:

$('#txtTesting').jStepper({minValue:0, maxValue:23, minLength:1}); // allows "1,1....2,1"

One idea is to only accept the first decimalSeparator.

When someone by accident comes to the site at /default.aspx, they should be redirected to just / to avoid duplicate content issues.

Hello

I came across your website today and thought it's a good plugin for my purposes. one thing though, if you type a dash (-) character it will be excluded after keyPress, but if you input some digits and then input a dash character, it will remain in the input field.
Maybe I'm using it wrong, if so please point out my mistake. If this is a bug, I would appreciate it being fixed in the next release.

Thanks in advance

I am using jquery jstepper 1.4.0 and updated to 1.5.3. After updating below functionality is not working.

$('#txtStudentNumber').jStepper({ minValue: 1, maxValue: 99999 });

When textbox is empty its keeping textbox value as 1 but my submit button is still disabled. I am using knockout for button enable/disable.

this.studentNumber = ko.observable($('#txtStudentNumber').val());

When this.studentNumber().trim().length == 0 then I am making the button disabled. But with the jstepper library update textbox is keeping minimum value when textbox is empty but my button is getting disabled. With older version it will not keep minimum value when its empty it used to keep minimum value when it's entered less than minimum value.

My QA team has written automation script to run this workflow, now its failing. They are clearing the textbox and entering some random number in textbox but after entering random number button is still disabled mode so test is failing.

Hello!

I'm about to apply your plugin to my project but I found an issue that if I input some number and then input many dashes then the dashes still remain in the text field. (Ex: 54--------------53453).

The snippet of code I am using is:
$('#MaxEntries').jStepper({ minValue: 1, minLength: 1, allowDecimals: false, disableNonNumeric: true });

Please investigate and fix it.

Thanks and best regards,
Diane

hi everyone

im using this plugin but there a bug when i reinitialize it on the same id it will not get my new
minValue and maxValue

here my code

$("#empid0").on('change',function(){
var td_count = $(this).attr("cnt");
//var tempid=$(this).attr("tempid");
//var empno=$("#empid"+td_count+" option:selected").attr("cc");
var empname=$("#empid"+td_count+" option:selected").attr("e_name");
var company_code=$("#empid"+td_count+" option:selected").attr("cc");
var branch_code=$("#empid"+td_count+" option:selected").attr("bc");	

  //
  //$("#empid"+td_count).val(empno);
  $("#empname"+td_count).val(empname);
  $("#empname"+td_count).attr("title",empname);
  $("#cc"+td_count).val(company_code);
  $("#bc"+td_count).val(branch_code);		
});

//element menu append to element name etc..
$("#element_name0").on('change',function(){
  //console.log("sss");
  var td_count =$(this).attr('cnt'); 		
  var treid=$("#element_name"+td_count+" option:selected").attr("element-id");
  var is_special=$("#element_name"+td_count+" option:selected").attr("is_special");
  var etxt=$(this).val();
  //alert("1");
  //var etypetxt=$(this).attr("element_menu_type");
  //alert(etxt +" || "+ etypetxt + "||" + treid);
  
  ///////////////////////////////////////
  //insert initial data on main table. //
  ///////////////////////////////////////
  
  //$("#element_name"+td_count).val(etxt).trigger('change');
  $("#element_name"+td_count).attr("title",etxt);
  $("#element_name"+td_count).attr("element-id",treid);

  $("#element_id"+td_count).val(treid);
  $("#element-btn"+td_count).attr("element-id",treid);
  $( "#element-sbtn"+td_count ).attr("element-id",treid);      
  //$("#type"+td_count).val(etypetxt);

  //alert(etxt);
  //return false;
  if(is_special=="1"){
    showEntryModalValuesException(td_count,etxt,treid);
  } else {
    showEntryModalValues(td_count,etxt,treid);
  }		
});

function showEntryModalValues(count,text,teid){
var count = count;//$(button).attr('cnt');
$.ajax({
url: base_url+"/entry_modal",
type: 'POST',
dataType: 'json',
data: {
element_id: teid,
element_name : text,
},
headers: {
'X-CSRF-TOKEN': $("#token").val(),
},
beforeSend: function(data){
loader.showPleaseWait();
//reset values....
$("#amount"+count).val("");
$("#amount"+count).attr('readonly',true);
$("#hours"+count).val("");
$("#hours"+count).attr('readonly',true);
$("#days"+count).val("");
$("#days"+count).attr('readonly',true);
$("#adjustment_date"+count).val("");
$("#element_label"+count).val("");

      for ( var i = 0, l = 13; i <= l; i++ ) {
           $("element-ent"+i+"-"+count).val("");
      } 
      //$("#adjustment_date"+count).attr('readonly',true);          
      //$("#adjustment_date"+count).removeClass('adjustment_date');
      //$("#adjustment_date"+count).bootstrapDP("remove");                        
      },          
      complete: function(data) {
        //called when complete
        loader.hidePleaseWait();
      },
      success: function(response) {
        //console.log(response);
        // /data = jQuery.parseJSON(data);
        
        if(response.data!=''){
          //$.each(data,function(index,value){
            $.each(response.data,function(index1,value1){
               //process fields base on count and values return....
               //console.log(value1);
               if(value1.base_name=="Pay Value" && value1.user_enterable_flag=='Y'){
                  $("#amount"+count).val();
                  $("#element_label"+count).val(value1.base_name);
                  $("#amount"+count).attr('readonly',false);  


                  if(value1.min=='' || value1.min==null) { value1.min=0 } else { value1.min=parseInt(value1.min) }
                  if(value1.max=='' || value1.max==null) { value1.max=0 } else { value1.max=parseInt(value1.max) }

                  $("#amount"+count).jStepper({
                      minValue:value1.min, 
                      maxValue:value1.max, 
                      //defaultValue:0,
                      allowDecimals:true,
                      minDecimals:2,
                      maxDecimals:2,
                    });
               } else if(value1.base_name=="Amount" && value1.user_enterable_flag=='Y'){
                  $("#amount"+count).val();
                  $("#element_label"+count).val(value1.base_name);
                  $("#amount"+count).attr('readonly',false);  

                  if(value1.min=='' || value1.min==null) { value1.min=0 } else { value1.min=parseInt(value1.min) }
                  if(value1.max=='' || value1.max==null) { value1.max=0 } else { value1.max=parseInt(value1.max) }

                  $("#amount"+count).jStepper({
                      minValue:value1.min, 
                      maxValue:value1.max, 
                      //defaultValue:0,
                      allowDecimals:true,
                      minDecimals:2,
                      maxDecimals:2,
                    });
               } else if(value1.base_name=="Hours" && value1.user_enterable_flag=='Y'){
                  $("#hours"+count).val();
                  $("#hours"+count).attr('readonly',false);

                  if(value1.min=='' || value1.min==null) { value1.min=0} else { }//value1.min=parseFloat(value1.min) }
                  if(value1.max=='' || value1.max==null) { value1.max=0 } else { }//value1.max=parseFloat(value1.max) }
                    //alert(value1.min+" X "+value1.max);
                  $("#hours"+count).jStepper({
                      minValue:value1.min, 
                      maxValue:value1.max, 
                      allowDecimals:true,                          
                      //defaultValue:0,
                      //overflowMode:'ignore',
                      minDecimals:2,
                      maxDecimals:2,
                    });
               } else if(value1.base_name=="Days" && value1.user_enterable_flag=='Y'){
                  $("#days"+count).val();
                  $("#days"+count).attr('readonly',false);

                  if(value1.min=='' || value1.min==null) { value1.min=0 } else { value1.min=parseInt(value1.min) }
                  if(value1.max=='' || value1.max==null) { value1.max=0 } else { value1.max=parseInt(value1.max) }
                    //alert(value1.min+" XXX "+value1.max);

/* $("#days"+count).removeAttr("id");
$("#days"+count).removeAttr("id","days"+count); */
$("#days"+count).jStepper({
minValue:value1.min,
maxValue:value1.max,
//defaultValue:0,
//overflowMode:'ignore',
//minDecimals:2
});

               } else if(value1.base_name=="Effective Date" && value1.user_enterable_flag=='Y'){
                  $("#effective_date"+count).val();
                  $("#effective_date"+count).attr('readonly',false);
                  //$("#adjustment_date"+count).addClass('adjustment_date');
                  $("#effective_date"+count).bootstrapDP({
                  format: "mm/dd/yyyy",
                  //viewMode: "months", 
                  //minViewMode: "months"
                  });
               }

            });
        //});
        }
        hideModal("large");

/* hideModal("large");
showModal("medium",data);
$("#modal-entry-back").attr("entry-count",count);*/
},
error: function(data) {
// called when there is an error....
loader.hidePleaseWait();
hideModal("large");
}
});
}

$('#txtTesting').jStepper({minValue:0, maxValue:23.999, minLength:2, minDecimals:3, maxDecimals: 3, decimalSeparator: '.'});

Enter value 0.999, then decrement one step.
If you look at the return value in AddOrSubtractTwoFloats for this operation, you will note it results in a NaN. This is because you are trying to cast

Number( ".0-1" )

It seems this function did not account for negative numbers properly.

try paste code below in stript field here http://jstepper.emkay.dk/ and test it

$('#txtTesting').jStepper({minValue:0, maxValue:23, minLength:2, onStep: testfunction});

function testfunction(objTextField, bDirection, bLimitReached) {

  if (bDirection) {
    // Was increased
  } else {
    // Was decreased
  }
  if (bLimitReached) {
    // A limit was reached
  } else {
    // A limit was not reached
  }

  alert(objTextField.val());

}

In this example:

$('#txtTesting').jStepper({minValue:0, maxValue:23, minLength:2, minDecimals:3, maxDecimals:3, decimalSeparator:'.'});

If I enter 24, the textfield is automatically reverted to 23 -- super!
But I expected it to revert to 23.000

Also, if I enter 2 and blur focus on the textfield, it remains 2. I expected it to change to 02.000

i have issue when i type 1 it will automatically fill up the min range but in the reality i want to type 12....

i try
disableAutocomplete:true,
overflowMode:'ignore'

but issue still exist ... im using chrome please sir reply

tia

Hello, I am using jQuery 3.2

Since hours hours always follow the same constant format, is there a attribute I can easily set where people enter their time.

Also, how can check/validate this inside the onchange inside a textbox?

Thanks

If I use input type number.

I can use the min and max feature but when I type alphabet, it doesn't work.

When checking if a field already has jStepper initialized it would make it easier if the plugin had a built-in way of tagging the field with a class when initializing.
This class can be used for both checking if it's initialized but also to apply custom styling to a jStepper'ed field.

Default should probably be the current way: No class is added. And then you'd have to explicitly set a class name to add if you want the plugin to do this.

hi sir i notice on the plugin that it works well but when i type several zeroes the validation not working
ex: 00000.00 and the default value i set 0.00 is not working

please do assist me sir. i love your plugin.

sir how to disabled the mousewheel plugin on your plugin ......

im having issues that the mousewheel work when the input is on readonly mode

TIA