Page 1 of 1
visible fields using onchange
Posted: Thu Feb 15, 2018 3:51 pm
by edalakiran
hi,
i have a small question regarding Javascript,
i have a first textbox when user enter some values i have to show or wont show second textbox based on the value. when the user enters positive value in first textbox, the second text box should show , when the user enters negative value in firsttextbox, second text box should not show, can anyone help me with this. here is the code i am using in onchange event.
var qtyorder = getObj('test');
console.log(qtyorder);
if ((getObj('test').innerHTML) > 0)
{
getObj('xxxxxx').visibility = "visible";
getObj('xxxxxx1').visibility = "visible";
}
else
{
getObj('xxxxxx').visibility = "hidden";
getObj('xxxxxx1').visibility = "hidden";
}
Re: visible fields using onchange
Posted: Thu Feb 15, 2018 4:21 pm
by Scott Klement
Since you are manipulating the DOM directly, you'll need to use standard DOM objects. There is no obj.visibility property in the standard DOM... I think you meant obj.style.visibility? Also, why are you using getObj multiple times for the same object? I mean, that'll work, but if you already have it in a variable, why call getObj again?
Try something like this, instead:
Code: Select all
var qtyorder = getObj('test');
if ((qtyorder.innerHTML) > 0)
{
getObj('xxxxxx').style.visibility = "visible";
getObj('xxxxxx1').style.visibility = "visible";
}
else
{
getObj('xxxxxx').style.visibility = "hidden";
getObj('xxxxxx1').style.visibility = "hidden";
}
This is untested.
Re: visible fields using onchange
Posted: Thu Feb 15, 2018 4:33 pm
by Megan
Are you maybe looking to use the onInput event?
I used the following code in the onInput event of TextBox1:
Code: Select all
// If the integer value of the input is greater than 0...
if(parseInt(this.value) > 0) {
// ...hide TextBox2...
getObj("TextBox2").style.visibility = "visible";
}
// ...otherwise...
else {
// ...show TextBox2.
getObj("TextBox2").style.visibility = "hidden";
}
Please notice the syntax for accessing an object's visibility:
getObj("TextBox2").
style.
visibility = "visible";
This code also works in the onChange event, though it does require that the value actually be changed in order to trigger. The onInput event triggers anytime the input changes.
Re: visible fields using onchange
Posted: Thu Feb 15, 2018 5:37 pm
by edalakiran
Hey Megan,
Thank you for the update, I don't see onInput event fo textBox.
i have one more question, when i write this on onchange event, it is not allowing the user to enter the full input as soon as the user enter it is triggering it is not waiting to complete the full input, maybe i need to write in some other event. any sugeestions.
Thanks
Kiran.
Re: visible fields using onchange
Posted: Thu Feb 15, 2018 6:10 pm
by Scott Klement
The "oninput" event was added in Profound UI 5.11.0, which was about 5 months ago. You could also do it "onkeyup" or "onkeydown" if you don't want to wait for the onchange event to fire.
Not sure what you mean by "it is triggering it is not waiting to complete the full input". By default, the enter key submits the screen back to the server -- is that what you mean? There's a screen-level property "disable enter key" that can be used to disable this. Or, you can disable it with code in the "onkeydown" event if you prefer to do it only for one field.
It is very unclear what is meant by "full input". Are you saying that they want to press enter in the middle of their input and continue entering more afterwards? Normally, enter is only pressed when someone is done entering text... but again, you can change that.
Re: visible fields using onchange
Posted: Thu Feb 15, 2018 7:31 pm
by Megan
Hello Kiran,
When possible, please provide which version of Profound UI you are using so that we may test solutions and check for possible issues in that version while we assist you.
I took the same code from my previous post and put it in the onChange event of TextBox1. I set TextBox2 to hidden until it is determined if it should be visible. I added the following code to the button's onClick event:
Code: Select all
getObj("TextBox1").value = get("TextBox1");
The following are screenshots of this example in ProfoundUI version 5.10.1:
Program Start:
- txtbxStr.png (1.26 KiB) Viewed 638 times
Enter positive value and click "Click Here":
- txtbxVis.png (1.34 KiB) Viewed 638 times
Enter negative value and click "Click Here":
- txtbxHid.png (1.34 KiB) Viewed 638 times
If you are having issues with the Enter key being pressed and submitting the screen, you can disable the Enter key by setting the
disable enter key property to true.
- disableEnterKey.png (3.23 KiB) Viewed 638 times
If you would like more in-depth assistance, please send us a screen dump. This can be done by pressing Ctrl + F9 while viewing the screen in question. When you are prompted to save or open the file, please save the file and email it to our support email address,
support@profoundlogic.com, as an attachment. Having the screen dump can help us provide a more complete and specific solution for your issue.