CODEWITHSUNDEEP
javascriptjqueryhtml
Tuhin Panda
Tuhin Panda

Reputation: 1

How to pass a jquery variable to html while calling post method

I am completely new to HTML and jquery, I have calculated some value in jquery part and that variable I want to pass to HTML.

<script>
    var datetime = new Date();
    var res = datetime.toString(); //res is the variable
</script> // end of the string

<div class="col-xs-8 center login-sub-container clearfix">
    <form id="loginDetails" name="loginDetails" action="http://192.198.9.228/loginOnline" method="post">
        <div class="login-form-elements">
            <input type="hidden" value=res name="dateTime"> // here the result i want to pass
        </div>
    </form>
</div>

When I see request packet I am seeing like the value is passing result not the value is inside the result variable

Upvotes: 0

Views: 2190

Answers (5)

Punit Sachan
Punit Sachan

Reputation: 593

I would like to offer a different solution as I feel you want to submit this form along with current date time field. This is how you can set dynamic value before you submit a form in jQuery.

<script>
var datetime = new Date();
var res = datetime.toString(); //res is the variable
function submitForm(){
    $("#loginDetails input[name=dateTime]").val(res);
    console.log($("#loginDetails input[name=dateTime]").val());
    $("#loginDetails").submit();
}   
</script>

<div class="col-xs-8 center login-sub-container clearfix">
    <form id="loginDetails" name="loginDetails" action="http://192.198.9.228/loginOnline" method="post">
        <div class="login-form-elements">
            <input type="hidden" value=res name="dateTime"> // here the result i want to pass
        </div>
        <input type="button" value="Submit" onclick="submitForm();">
    </form>
</div>

Upvotes: 0

Bivin Damodhar
Bivin Damodhar

Reputation: 69

If you are using jquery, you achieve this as mentioned below :

<script src="//code.jquery.com/jquery-1.12.4.js"></script>
<script>
    var datetime = new Date();
    var res = datetime.toString(); //res is the variable
     $(document).ready(function(){
        $("#datetime").val(res);
    });
</script> // end of the string

Then in the hidden text just add an id like :

<input type="hidden" name="dateTime" id="datetime" >

Then here it is not necessary to provide a seperate value attribute. Hope it works for you.

Upvotes: 0

Krzysztof Janiszewski
Krzysztof Janiszewski

Reputation: 3854

jQuery is unnecessary here. Just use .value

Also do not set attribute in html without single or double quotes.
I mean that part <input ... value=res ...> You should always use single ' or double " quotes (<input ... value="res" ...>)

var datetime = new Date();
var res = datetime.toString();

document.querySelector("input[name='dateTime']").value = res;
<div class="col-xs-8 center login-sub-container clearfix">
  <form id="loginDetails" name="loginDetails" action="http://192.198.9.228/loginOnline" method="post">
    <div class="login-form-elements">
      <input type="text" value="result" name="dateTime">
    </div>
  </form>
</div>

Upvotes: 2

nacho1493
nacho1493

Reputation: 497

You should set the value.

For example, with JQuery:

$("[name=dateTime]").val(res);

Upvotes: 0

Nikhil Aggarwal
Nikhil Aggarwal

Reputation: 28475

You can use jQuery.val

var datetime = new Date();
var res = datetime.toString();
$("[name='dateTime']").val(res);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="col-xs-8 center login-sub-container clearfix">
                        <form id="loginDetails" name="loginDetails" action="http://192.198.9.228/loginOnline" method="post">
                            <div class="login-form-elements">
 <input type="hidden" value=result name="dateTime" >

Upvotes: 0

Related Questions