Primefaces get value from input text without bean binding - javascript

I have simple button and input text:
<p:button id="someBtnID" value="Join" />
<p:inputText id="someID" placeholder="ID" />
I want on button click get value from input text, concat it and do redirect.
For example: I have link domain.com/folder/action=
input text value = 11025
I need concat value from input text here and do redirect to domain.com/folder/action=11025
Can I do it without binding with any bean in JSF but on frontend?

Related

How do I make an html text input readonly but be able to update with a script?

I have these inputs that take the values of a from a in my table when I click on a row. I want to make it so that the user cannot change the input themselves but want to bring values into them when a user clicks a table row. I will be passing these inputs in as a form. I know that when the input is like this:
that it will not be updated. Is there any other way to do it with an input. Is there a different type of tag I can use that can be passed through a form?
Rather than a read-only <input>, I'd go with a combination of a display element and a hidden form element. Something like:
<div id="my-display">This is a value</div>
<input id="my-input" name="my-input" type="hidden" />
And in the code update both:
$('#my-display').text(yourValue);
$('#my-input').val(yourValue);
You can style the display to the user however you like and don't have to worry about whether or not it "de-activates" the form input.
If you really want it to be an inactive input, you can use the same approach:
<input class="my-input" type="text" disabled />
<input class="my-input" type="hidden" name="my-input" />
Which may even save you a line of code here, since both can now use .val():
$('.my-input').val(yourValue);
Try disabled keyword as here
<div id="my-display">This is a value</div>
<input id="my-input" name="my-input" type="text" disabled/>
You can change the value by javascript as below:
document.querySelector('#my-input').value = 'the value you want to enter by javascript';

Input text field not displaying the value inside the "quotes"

From the asp.net MVC project: I have an input text field, and its value should comes from database. But the text inside the quotes has been prevent from value.
Sample text: Some text "150"
But it render as: <input type="text" id="" value="Some text" "150">
I need to display complete text inside the quotes as input value that comes from database..!
If you are using asp.net MVC, use #Html.Raw()
If it is plain HTML then you can combine single with double quotes.
ex.
<input type="text" id="" value='Some text"150"'>
If you need a precise answer then you need to specify how your UI is being rendered.

How to disable an input of type text with another input of type text?

i have 2 input of type text (Id and name). I want to search id in my database and find name related to this id and set it in input of name and also disable this input. For this mean i write a function(with java language) that get name related to id input. But i test it with a submit button that is not what i want.1) I want to call function when id input is fill
2)also the name input disable option set to true, when id input is empty it change to false
This is my jsp code:
<input type="text" id="id">
<input type="text" id="name">
<input type="submit" formaction="myFunc">
You should use onChange event, that is described here: https://www.w3schools.com/jsref/event_onchange.asp
As #Marek said, use the onchange event to call a JavaScript function. Then see this post for how to disable an input with JavaScript:
How to disable an input type=text?

How to enable HTML elements on submit

I have a checkbox and a few input elements related to this checkbox as shown below
<input name="balanceFeaturesOn" id="balanceFeaturesOn" type="checkbox" disabled="disabled" checked="" />Control
<input name="IntervalDays26566521" type="Text" onclick="" onchange="" value=" 31 ">
<input name="IntervalHours26566521" type="Text" onclick="" onchange="" value=" 12 ">
For some reasons, I will have to keep my checkbox always disabled.
On the submit of above form (Say that the checkbox and inputs are inside a form), in the server code, I want to grab the text inputs based on if the checkbox was checked/unchecked. However since the checkbox is disabled, the request parameter does not contain the balanceFeaturesOn property.
So when I execute the below line:
String[] balanceFeatArr = request.getParameterValues("balanceFeaturesOn");
I am not getting any value...
So my question is how do I be able to get the value of the checkbox while still keeping it disabled on the UI?
Try the following code,
In the form use javascript function to submit the form,
<input type='submit' onclick='javascript:submitMe()' />
Javascript function,
function submitMe(){
$('#balanceFeaturesOn').removeAttr('disabled');
$('#formId').submit(); //Replace with the actual id of the form
}
Make sure you have included jquery library in your code.
Use Hidden Fields.
Hidden fields are similar to text fields, with one very important difference!
The difference is that the hidden field does not show on the page. Therefore the visitor can't type anything into a hidden field, which leads to the purpose of the field:
To submit information that is not entered by the visitor.
http://www.echoecho.com/htmlforms07.htm

Required JSF input component which is hidden by JavaScript is still validated

I have a list of values from ,from the list of values i want to check some values means at that corressponding text box will show in bottom.Otherwise the text box will be hidden.I have done this process using javascript. But my issues is i have to validate using required=true attribute. But the problem is the hidden text box also validated.
Primefaces pages for List values:
<p:selectManyCheckbox onchange="checkValue();" value="#{volunteerBean.knowAbt}" layout="pageDirection" id="s" immediate="true" required="true" requiredMessage="Select how to konws about cv?" style="width:300px;height:170px;">
<f:selectItems value="#{volunteerBean.hearLst}" var="he" itemLabel="#{he}" itemValue="#{he}" />
<p:ajax event="change" update="msg1111" />
</p:selectManyCheckbox>
Input Text Box coding:
<p:inputText style="display:none;" id="searchEngine" value="#{volunteerBean.searchEngine}"><p:watermark for="searchEngine" value="Search Engine"/>
JavaScript for hidden and show inputText through checking the list of checkBox:
function checkValue() {
var chk = document.getElementById("volunteerForm:s:10");
if (chk1.checked) {
document.getElementById('volunteerForm:searchEngine').style.display='';
}else {
document.getElementById('volunteerForm:searchEngine').style.display='none';
}
}
I am using primefaces 3.0 and jsf 2.0. How to solve it
You're changing only the HTML DOM tree and you're not changing the JSF component tree. JSF is not aware at all that the HTML element has been hidden in the client side. You need to show/hide the JSF component instead by its rendered attribute and include its client ID in the <p:ajax update>.
<p:selectManyCheckbox ... value="#{volunteerBean.knowAbt}">
<f:selectItems value="#{volunteerBean.hearLst}" />
<p:ajax event="change" update="msg1111 searchEngine" />
</p:selectManyCheckbox>
<p:inputText id="searchEngine" ... rendered="#{volunteerBean.knowAbt.contains('valueOfItem10')}" />
where valueOfItem10 is the exact value of the item at index 10, like as you tried to check in JS. Note that I assume that knowAbt is a List<String>, exactly as your hearLst suggests (for which I have removed the superfluous var, itemLabel and itemValue from the above example as they are the defaults already). Otherwise you'd need to perform the job in a helper method of the backing bean instead.

Categories