make a button disable/enable base on java flg in the struts2 - java

Action:
public class TuAction() extends ActionSupport{
private boolean loseItemFlg=false;
private String doFuilureOrder(){
if(...){
loseItemFlg=true;
}
return SUCCESS;
}
public boolean isLoseItemFlg() {
return loseItemFlg;
}
public void setLoseItemFlg(boolean loseItemFlg) {
this.loseItemFlg = loseItemFlg;
}
}
And my Jsp:
function dialogOpen(formName,actionName){
if(comfirm("do you want do this?")){
....
document.forms[formName].action=actionName;
document.forms[formName].submit();
}else{
//i want do not reload the page.
}
}
<input type="button" disable="%{loseItemFlg}" value="lose"
onclick="dialogOpen('tuAction', '<%request.getContextPath()%>/tuAction_doFuilureOrder.action')"
/>
But this code the button's disable property is not by my control!!
Then i change the jsp to:
<s:submit type="button" disable="%{loseItemFlg}" value="lose"
onclick="dialogOpen('tuAction', '<%request.getContextPath()%>/tuAction_doFuilureOrder.action')"
/>
Now the button's disable property is by my control,but the "doFuilureOrder()" is not by used.
About do not reload the page should do what in my jsp.
My English is terrible,And this is my first time to use the stackoverflow. Someone know what I means.

For the input tag, disabled property is not based on true/false. When u write disabled attribute then the input is disabled by default, Please check Fiddle
<input type ='button' disabled='true' value='Button1'/>
<input type ='button' disabled='false' value='Button2'/>
In above code, both buttons is in disabled state.
For your purpose we can rewrite your code as:
Method 1:
By using struts if tag
<s:if test="%{loseItemFlg}"> // if true - button disabled state
<input type="button" disabled value="lose" onclick="dialogOpen('tuAction','<%request.getContextPath()%>/tuAction_doFuilureOrder.action')"/>
</s:if><s:else> //button enabled
<input type="button" value="lose" onclick="dialogOpen('tuAction','<%request.getContextPath()%>/tuAction_doFuilureOrder.action')"/>
</s:else>
Method 2:
Rewrite your java code as,
private String loseItemFlg='';
private String doFuilureOrder(){
if(...){
loseItemFlg="disabled";
}
return SUCCESS;
}
public String getLoseItemFlg() {
return loseItemFlg;
}
public void setLoseItemFlg(String loseItemFlg) {
this.loseItemFlg = loseItemFlg;
}
then in jsp :
<input type = "button"
<s:property value="%{loseItemFlg}"/> value="lose" onclick = "dialogOpen('tuAction'),'<%request.getContextPath()%>/tuAction_doFuilureOrder.action')" />

You can't nest scriptlet in Struts tags (like in your second case), while you can (but you should NOT, because using scriptlets is a bad-practice) inject them in HTML tags.
You can then use the <s:property /> tag in the HTML tag (first case)
<input type = "button"
disable = "<s:property value="%{loseItemFlg}"/>"
onclick = "dialogOpen('tuAction'), '<%request.getContextPath()%>/tuAction_doFuilureOrder.action')"
/>
, or substitute the scriptlet in your Struts tag (second case), better using the <s:url /> tag to mount the URL:
<s:url action = "tuAction_doFuilureOrder.action"
namespace = "/"
var = "myUrl"
/>
<s:submit type = "button"
disable = "%{loseItemFlg}"
onclick = "dialogOpen('tuAction'), '%{myUrl}')"
/>
they both work.
The <s:url /> usage can (and should) be applied to the first case too:
<s:url action = "tuAction_doFuilureOrder.action"
namespace = "/"
var = "myUrl"
/>
<input type = "button"
disable = "<s:property value="%{loseItemFlg}"/>"
onclick = "dialogOpen('tuAction', '<s:property value="%{#myUrl}"/>')"
/>

Related

How do i get changed value of a single checkbox in requestparam and pass it to ModelAndView in spring boot?

html file:
<html>
<body>
<label>
<input type="checkbox" name="postcheckbox" />
demo checkbox
</label>
</body>
</html>
I want to get the value of changed state of checkbox in my controller.
By using Js
var checkbox = document.querySelector("input[name=postcheckbox]");
checkbox.addEventListener('change', function() {
if (this.checked) {
console.log("Checkbox is checked..");
//pass to model
} else {
console.log("Checkbox is not checked..");
//pass to model
}
});

How to make HTML Button perform action in Java?

Basically I'm creating an upvote/downvote system, Now I've created two buttons in HTML :
<button type="button" name="upvote"></button>
<br>
<input type="number" th:value = "${commentValue}" disabled>
<br>
<button type="button" name="downvote"></button>
First button with name attribute - "upvote" and second with "downvote" , Now I want to catch a click on button and change the commentValue accordingly, If user clicks upvote, comment value must incriment and on downvote it must decrement
I found some topics that said to implement ActionListener, Create JButton objects and etc. but isn't there any simpler way ?
This is my code right now, The buttons do nothing. :
Controller :
private int numberValue = 0;
#GetMapping("/check")
public String nuberCheck(Model model){
model.addAttribute("commentValue", numberValue);
return "numberCheck";
}
#PostMapping("/check")
public String upvote(Model model, #RequestParam String action){
if (action == "upvote"){
numberValue++;
model.addAttribute("commentValue", numberValue);
}else if (action == "downvote"){
numberValue --;
model.addAttribute("commentValue", numberValue);
}
return "numberCheck";
}
numberCheck :
<form action="#" th:action="#{/check}" method="post">
<button type="button" name="action" th:value="upvote" th:text = "upvote"></button>
<br>
<input type="number" th:value = "${commentValue}" disabled>
<br>
<button type="button" name="action" th:value = "dowvnote" th:text = "dowvnote"></button>
</form>
FIXED
Change button types to "submit" and then in controller :
#PostMapping("/check")
public String check(Model model,#RequestParam String action) {
System.out.println(action);
if (action.equals("upvote")) {
numberValue++;
model.addAttribute("numberValue", numberValue);
}
if (action.equals("dowvnote")) {
numberValue--;
model.addAttribute("numberValue", numberValue);
}
return "numberCheck";
}
#RequestParam String action "action" is the name attribute of button and "save" and "cancel" are the "value" attributes :) hope it helps
Sample:
HTML:
<form action="#" data-th-action="#{/action}" data-th-object="${model}" method="post">
<button type="submit" name="upvote"></button>
<button type="submit" name="downvote"></button>
</form>
Java:
#RequestMapping(value="/action", method=RequestMethod.POST)
public ModelAndView onClickAction() {}
Use the following and implement in your code
$(document).ready(function(){
$("#up").click(function(){
var up = $.post("/upvote", {changeBy: 1}, function(dataBack){
$("#upvote").text(dataBack);
});
});
$("#down").click(function(){
var down = $.post("/downvote", {changeBy: 1},
function(dataBack){
$("#downvote").text(dataBack);
});
});
});
You can use jquery for that. first add jquery library in your html page and write function like below inside script tag
function upVote(){
var counter= $('.comment').val();
counter++;
$('.coment').val(counter);
}
function downVote(){
var counter= $('.comment').val();
counter--;
$('.coment').val(counter);
}
<button type="submit" name="upvote" th:onclick="'upVote();'"></button>
<br>
<input type="number" class="comment"th:value = "${commentValue}" disabled>
<br>
<button type="submit" name="downvote" th:onclick="'upVote();'"></button>
There is one best way to solve this. When you click button trigger one event and at that event increase or decrease value. Use that value in an thymeleaf and pass it to the controller.

Why submitting a form with Ajax it's not setting model data using ModelDriven in Struts 2?

I have following situation in code:
Action class:
#NameSpace("/")
public class MyAction extends ActionSupport implements ModelDriven<Car> {
private Car car = new Cart();
#Override
public Car getModel() {
return car;
}
#Action(value = "pageAction", results = {name = SUCCESS, location = "myPage", type="tiles"})
public String showPage() {
return SUCCESS;
}
#Action(value = "formSubmitAction", results = {name = SUCCESS, location = "results.jsp"})
public String formSubmitAction() {
System.out.println(car);
// everything has default values (nulls)
return SUCCESS;
}
}
View for myPage location:
<s:form
namespace="/"
action="pageAction"
method="post" >
<s:push value="model">
<s:textfield name="color" />
<s:textfield name="manufacturer" />
<sj:submit
href="formSubmitAction"
targets="output" />
</s:push>
</s:form>
<div id="output"></div>
results.jsp:
renders empty content into div#output
<s:property value="%{model}" />
<s:property value="%{model.color}" />
<s:property value="%{model.manufacturer}" />
I wonder why is that happening? Model data is not updated after submit.
I'm using struts2-jquery submit tag.
When I'm using simple form submit without Ajax the model is being updated,
but I want to load data asynchronously with Ajax.
How can I achieve that?
The solution is to add ID to form and to sj:submit tag. But I don't know why submit tag inside form wasn't working properly. The correct code is below:
<s:form
id="formId"
namespace="/"
action="pageAction"
method="post" >
<s:push value="model">
<s:textfield name="color" />
<s:textfield name="manufacturer" />
<sj:submit
formIds="formId"
href="formSubmitAction"
targets="output" />
</s:push>
</s:form>
EDIT
As it turns out you only have to add ID to form, and everything works :)
look at link in the comment below
The modelDriven interceptor pushes a model on top of the valueStack. So you can access model properties directly.
<s:property value="%{color}" />
<s:property value="%{manufacturer}" />

Checkbox shows up as disabled

I'm mistified why a checkbox would show up disabled.
What do I need to do to enable it?
Already tried using String object for the requestInvoice property, does not help.
JSP:
<fieldset class="aa-list-primary-indent">
<label class="custombox-wrapper custombox" data-behavior="custombox">
<div class="control checkbox"></div>
<html-el:checkbox styleId="requestInvoiceCheckbox" property="form(creditCardForm).personalId.requestInvoice" />
In need of an invoice (factura)
</label>
</fieldset>
Form:
private boolean requestInvoice = false;
public boolean isRequestInvoice() {
return requestInvoice;
}
public void setRequestInvoice(boolean requestInvoice) {
this.requestInvoice = requestInvoice;
}
HTML generated by the browser (Chrome):
<input type="checkbox" name="form(creditCardForm).personalId.requestInvoice" value="on" id="requestInvoiceCheckbox">
Sorry, it's a bad question.
The CSS setup makes the checkbox look disabled, even though it is not. Bad CSS design.
All the JSP/Java/HTML code above is fine.

How to change a form value dynamically and submit during onclick

I am using onclick event in anchor tag. when i clcik the anchor, I am invoking a java script function where I change the value of one input element and submit the form. The value is changed but the form does not submit the value. Please help me on this. FYI that if i create an element and add in the form before submission, it works. Why is not working in the first scenario.
<form name="form" >
<input type="hidden" name="input" value="test"/>
<a onclick='testMethod("test")'>click </a>
</form>
script used is
function testMethod(value)
{
if(serviceName != null && jQuery('#form') != null)
{
document.forms['form'].getElementById('input').value = value;
document.forms['form'].action = jQuery('#newAction').val();
document.forms['form'].submit();
}
}
The main problem here is you're trying to access the input by id when it doesn't have one set:
(Added id to form and id to input so we can select them easily):
<form name="form" id="form">
<input type="hidden" name="input" id="input" value="test" />
<a onclick='testMethod("test")' >click</a>
</form>
And the javascript to match (updating to use jQuery's selectors since you indicated you have jQuery support available):
function testMethod(value)
{
var form = $('#form');
if(serviceName != null && form.length)
{
$('#input').val(value);
form.attr('action', $('#newAction').val());
form.submit();
}
}
You can also update your code such that you aren't including the binding to the onclick method in the DOM, but attaching to it directly in javascript:
Changing the a element to have an ID:
<form name="form" id="form">
<input type="hidden" name="input" id="input" value="test" />
<a id="submitLink">click</a>
</form>
The javascript could now look like this:
$(document).ready(function() {
$('#submitLink').on('click', function(event) {
event.preventDefault();
var form = $('#form');
if(serviceName != null && form.length)
{
$('#input').val(value);
form.attr('action', $('#newAction').val());
form.submit();
}
});
});

Categories