Skip to Content
This question has been flagged
jqueryodoojsonrpcJavascriptCallFromOdooOdoo10.0
3 Replies
36961 Rodiniai
Portretas
Kirubanidhi Rajarathinam

I created the form in Odoo XML file. When I click to submit the form that same time both input box value does not get in my script.js file. I want to get the input box field value from XML file to Odoo javascript file.

How do I get the input value from XML to JS file?

example.xml:

<template id="example_page" name="Example page" page="True">

    <tt-call="website.layout">

        <tt-name="DemoTemplate">

            <divclass="oe_structure">

                <divclass="container">

                    <formtarget="_self"action=""method="post"id="test_form">

                        Value of A: <inputtype="text"name="num_a"class="num_A"/><br/>

                        Value of B: <inputtype="text"name="num_b"class="num_B"/><br/>

                        Total Value: <input type="text" name="total" class="total" readonly="True"/><br/>

                         <button type="button" name="button" class="my-button">

                            <a href="/example" class="btn btn-info">Submit</a>

                        </button>

                    </form>

                </div>

            </div>

        </t>

    </t>

</template>

Script.js file:

$('#test_form').on('click', 'button.my_button', function(e) {

        e.preventDefault();

        var num_A = parseInt($("input[name='num_a']").val());

        var num_B= parseInt($("input[name='num_b']").val());

        console.log('hello');

        console.log('num_A ');

        console.log('num_B');

        ajax.jsonRpc('/my_url/some_url', 'call', {'a': num_A, 'b': num_B})

            .then(function(result){

                    console.log(result);

                    var output_data=result['total'];

                    console.log(output_data);

                    $("#total").html(output_data);

                });

        });

example.py:

   @http.route(['/my_url/some_url'], type='json', auth="public", website=True)

    def some_url(self, **arg):

        #Fetch input json data sent from js

        print "Welcome to JSON function"

        a = arg.get('a')

        b = arg.get('b');

        total_sum = a + b

        res={'total':str(total_sum)}

        print res

        return res


I want to set the total value in my input box how can I achieve it.

Portretas
Atmesti
Portretas
Cybrosys Techno Solutions Pvt.Ltd
Best Answer

Hi,

Update your script with this code,

    $('#test_form').on('click', 'button.my-button', function(e) {
    e.preventDefault();
    var num_A = $( ".num_A" ).val();
    var num_B= $( ".num_B" ).val();
    });


Now you will get the values of input fields in num_A,  num_B


Thanks


Portretas
Atmesti
Portretas
Kirubanidhi Rajarathinam
Autorius Best Answer

Finally, I found the answer,

I created the XML file,

code:

   <template id="example_page" name="Example page" page="True">

      <t t-call="website.layout">

          <t t-name="DemoTemplate">

            <div class="oe_structure">

              <div class="container">

                <center><h3>Title</h3></center>

                <p>

                  <a t-attf-href="/example/detail" class="btn btn-info">Company detail page</a>

                </p>

                <p> Welcome to HTTP Request and Response Page</p>

                <div id="test_div">

                    <label for="f_name">First Name</label>

                    <input type="text" name="f_name" class="f_name" id="f_name"/><br/>

                    

                    <label for="l_name">Last Name</label>

                    <input type="text" name="l_name" class="l_name" id="l_name"/><br/>

                    

                    <label for="email">Email</label>

                    <input type="text" name="email" class="email" id="email"/><br/>

                    

                    <label for="contact_no">Contact No</label>

                    <input type="text" name="contact_no" class="contact_no" id="contact_no"/><br/>

                    

                    <label for="address">Address</label>

                    <input type="text" name="address" class="address" id="address"/><br/>

                    

                    <label for="address">Customer Address</label>

                    <textarea name="full_address" class="full_address" id="full_address" rows="7" cols="30" readonly="True"/><br/>

                    

                    <input type="button" value="Submit" id="submit" />

                </div>

              </div>

            </div>

           </t>

      </t>

    </template>

py file like as,

#    Data processing and fetch output data-----

    @http.route(['/json_call_fun'], type='json', auth="public", website=True)

    def some_url(self, **arg):

        #Fetch input json data sent from js

        first_name = arg.get('first_name')

        last_name = arg.get('last_name');

        email = arg.get('email')

        number = arg.get('number');

        address = arg.get('address')

        result=first_name+''+ last_name +'\n' + email + '\n' + number +'\n' + address

        res={'name':result}

        return res

Javascript file,

odoo.define('sample_webcontrol.script', function (require) {

    "use strict";


var ajax = require('web.ajax');

$(document).ready(function() {

$('#test_div').on('click','#submit',function(){

var f_name = $(".f_name").val();

var l_name = $(".l_name").val();

var email = $(".email").val();

var number = $(".contact_no").val();

var address = $(".address").val();

ajax.jsonRpc("/json_call_fun", 'call',{

  first_name : f_name,

  last_name : l_name,

email : email,

  number : number,

  address : address

}).then(function(result){ 

var output_data=result['name'];

$('.full_address').val(output_data);

    });

});

});


});

While refresh page, run the js file. JS file inside call the URL as '/json_call_fun'. Check this URL in Py file after then execute the some_url code. JSON data result return to JS file. Then set the value to HTML file. This is the way of getting and setting the JSON data from odoo to JS.



Portretas
Atmesti
Related Posts Replies Rodiniai Veikla
OwlError: The following error occurred in onMounted: "invalid portal target"
odoo JavascriptCallFromOdoo
Portretas
Portretas
1
lapkr. 24
2052
How to create custom Jquery AJax Post in Odoo?
jquery odoo
Portretas
0
spal. 16
4210
jsonrpc bulk write
api odoo jsonrpc
Portretas
Portretas
1
bal. 25
1966
Odoo JsonRPC : Get m2m, m2o or o2m nested field with read method
odoo jsonrpc odoo17
Portretas
0
vas. 25
2006
how to load a translation with json rpc ?
translations odoo jsonrpc
Portretas
Portretas
Portretas
2
birž. 23
6592