Clicking on field in edit mode empties fields value

  • 1
  • Question
  • Updated 3 years ago
  • Answered
Hello,

I have a use case from a client where they would like to have a way to put their cursor in a skuid field that already has a value in it and when they click to put their cursor in it or open it up for editing that the field value would go blank.

In their use case they have a lot of number fields where they are changing multiple values and having one be 0 for instance, they have to delete the zero to be able to change it to 1 instead of 10. We've explained they can tab through each field which would highlight the values, but they are looking to have a bit of a different experience if possible.

If anybody has any ideas on how to solve this via a snippet that would be super helpful!

Thanks!
Photo of Jeff Rutter

Jeff Rutter

  • 1,162 Points 1k badge 2x thumb

Posted 3 years ago

  • 1
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
This sounds like a perfect use case for javascript custom renderer.  This renderer could detect edit mode and in that case remove all the value of the field. 
Photo of Thimo

Thimo

  • 1,280 Points 1k badge 2x thumb
The following inline-snippet should solve your use case.

(function(skuid){	var $ = skuid.$;
$(document.body).one('pageload',function(){
$('input').on('focus', function() {
   $(this).val('');
});
});
})(skuid);
Photo of Jeff Rutter

Jeff Rutter

  • 1,162 Points 1k badge 2x thumb
Thanks, Thimo this comes really close to solving my use case after finally getting back to this topic!

I noticed that this only works if the field editor comes defaulted as "edit" and when the field is in read with in-line edit it doesn't work even if you were to open it up for editing. My question might have been a bit unclear originally, but would you know of any way to allow it to function regardless of what mode the field editor comes pre-loaded as and if you were to click into a field?

Also, when we excute any other javascript snippets on the page this functionality is lost. Have you found any ways to allow something like this inline resource to continue to work even after javascript snippets have been run?

Thanks!

Jeff
Photo of Rob Hatch

Rob Hatch, Official Rep

  • 44,006 Points 20k badge 2x thumb
Thanks Thimo! 
Photo of Jeff Rutter

Jeff Rutter

  • 1,162 Points 1k badge 2x thumb
Yes, thanks so much guys! I'll check this out!