How to save user entered values โ€‹โ€‹in XForms textbox

I am new to xforms. and this question seems very simple. I have an xform that contains two text boxes and a control button. I want that when the user submits the form, the values โ€‹โ€‹in the textbox are saved in the xform model. How can i do this?

The code is below, when I click the button, the values โ€‹โ€‹in the model element do not change.

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:form="http://www.w3.org/2002/xforms"      xmlns:ev="http://www.w3.org/2001/xml-events" xml:lang="en">
<head>
    <link rel="stylesheet" type="text/css" href="test.css" />
<script type="text/javascript" src="formfaces.js"></script>


<form:model>
    <form:instance>
    <data xmlns="">
<textbox1>0</textbox1>
<textbox2>1</textbox2>
<textbox3>2</textbox3>
<textbox4>3</textbox4>
</data>

</form:instance>
<form:submission action="Text.html" id="submission" method="put" replace="instance"/>
</form:model>
</head>


<body>
<table>
<tr>
<td>
<form:input ref="/data/textbox1">
<form:label>TextBox1</form:label>
</form:input>
</td><td>
<form:input ref="/data/textbox2">
<form:label>TextBox2</form:label>
</form:input>
</td></tr>

<tr><td><form:input ref="/data/textbox3">
<form:label>TextBox3</form:label>
</form:input>
</td><td><form:input ref="textbox4">
<form:label>TextBox4</form:label>
</form:input>
</td></tr>



</table>
<form:submit submission="submission"><form:label>Submit</form:label></form:submit>


</body>

</html>

      

0


source to share


1 answer


This should be taken care of automatically.

But if you are trying to immediately display the model changes on the screen, be sure to add attributes incremental="true"

to the xforms input elements so that every key press will fire update events, and the xforms output elements are also updated.

added:

You seem to be submitting html. I am assuming it is html containing the form. You don't need to call it that to update the model. Usually you call the script with PUT submit to get it back to the server. PUT usually doesn't return anything either, although it may return a copy of what you were PUT'ing.



I made two important changes to your code to show that the model is automatically updated. I copied your form input tables and renamed inputs to outputs. I also added an additional attribute on the inputs to update the output after every key press. You may also notice that I added some CSS, but this is only to make the label and the value of the outputs distinguishable:

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:form="http://www.w3.org/2002/xforms"      xmlns:ev="http://www.w3.org/2001/xml-events" xml:lang="en">
<head>
    <link rel="stylesheet" type="text/css" href="test.css" />
<script type="text/javascript" src="formfaces.js"></script>
        <style type="text/css">
            label {
                display: block;
                float: left;
                clear: both;
                text-align: right;
                padding-right: 1em;
                width : 110px;
            }
        </style>


<form:model>
    <form:instance>
    <data xmlns="">
<textbox1>0</textbox1>
<textbox2>1</textbox2>
<textbox3>2</textbox3>
<textbox4>3</textbox4>
</data>

</form:instance>
<form:submission action="test.xml" id="submission" method="put" replace="instance"/>
</form:model>
</head>


<body>
<table>
<tr>
<td>
<form:input ref="/data/textbox1" incremental="true">
<form:label>TextBox1</form:label>
</form:input>
</td><td>
<form:input ref="/data/textbox2" incremental="true">
<form:label>TextBox2</form:label>
</form:input>
</td></tr>

<tr><td><form:input ref="/data/textbox3" incremental="true">
<form:label>TextBox3</form:label>
</form:input>
</td><td><form:input ref="textbox4" incremental="true">
<form:label>TextBox4</form:label>
</form:input>
</td></tr>



</table>
<table>
<tr>
<td>
<form:output ref="/data/textbox1">
<form:label>TextBox1</form:label>
</form:output>
</td><td>
<form:output ref="/data/textbox2">
<form:label>TextBox2</form:label>
</form:output>
</td></tr>

<tr><td><form:output ref="/data/textbox3">
<form:label>TextBox3</form:label>
</form:output>
</td><td><form:output ref="textbox4">
<form:label>TextBox4</form:label>
</form:output>
</td></tr>



</table>
<form:submit submission="submission"><form:label>Submit</form:label></form:submit>


</body>

</html>

      

If you replace the value of the submit action attribute with a link to some .asp script, it gets called and gets the entire instance in the request body. Be sure to return a complete copy as it will be replaced.

NTN!

0


source







All Articles