submitting the form when updating .load file

[Jason Solack]

Hello all, i have this view:

<form name='test' id='test'>

    <input type='checkbox' id='filter_1' value='1'><label for='filter_1'>Test me</label>

    <div>

        {{=LOAD('chart','test.load',ajax=True, target='test_div', )}}

    </div>

    <button id='try' type='button'>Test this out</button>

    <script>

    $('#try').click(function(){

        jQuery('#test_div').get(0).reload()

    });

    </script>

</form>

and i'm trying to submit that for when reloading my "test.load"...

here's the controller:

def test():

    print request.vars

    ....

when i print those request.vars i'm just seeing empty storage.  Is there something else i need to do to submit the form when reloading like this?

Thank you

Jason

[Massimo Di Pierro]

Not sure what you are trying to do. could you explain again? Why do you have  LOAD inside a form?

[Jason Solack]

Sorry i'm not clear!  I'm trying to break up a reporting site and my initial idea was to use several LOAD components where in the past i was using ajax calls.  I like the component framework as it seems i can return HTML templates... it just feels cleaner.

I have this component within the form, but i could keep all the components outside the form if that is required to have them passed to their corresponding controller.

Another quick question on components.  Is there a way to wait for them to be loaded until called upon or must they be all loaded on the initial page load?

Thank you for your help

Jason

[Anthony]

On Sunday, December 6, 2015 at 7:15:04 PM UTC-5, Jason Solack wrote:

Sorry i'm not clear!  I'm trying to break up a reporting site and my initial idea was to use several LOAD components where in the past i was using ajax calls.  I like the component framework as it seems i can return HTML templates... it just feels cleaner.

I have this component within the form, but i could keep all the components outside the form if that is required to have them passed to their corresponding controller.

Another quick question on components.  Is there a way to wait for them to be loaded until called upon or must they be all loaded on the initial page load?

Still not quite clear what you are trying to do with the form (as it has no action nor submit button). Anyway, you can always manually load and/or reload a component as follows:

First, create a div:

<div id='mycomponent'></div>

Then load a component into the div via:

$.web2py.component('{{=URL('controller', 'function.load')}}', 'mycomponent');

Anthony

[Jason Solack]

So in this case i was just wanting to see if the form was submitted when reloading the component via:

        jQuery('#test_div').get(0).reload()

and by printing the request.vars to the terminal i saw that it wasn't.  I will try your method $.web2py.component and see what results

[Jason Solack]

So i tried loading this in the way described above and my form is still not being submitted to the controller.  When i check to see if i can serialize the form it has values in it by alerting it in javascript, but web2py doesn't see it in my request.

is there something i have to do to ensure that my form is being submitted to the controller?  or is there a way to explicitly submit it?

Thank you again and sorry for the confusion!

[Jason Solack]

After going through the example in the documentation i'm wondering if the issue has to do with the 

data-w2p_target="..."

that is generated by a web2py generated form.  In my case i'm building the form by hand.  I wonder if i need to "link" this to my component when building a form by hand? 

[Anthony]

Why would the form submit because you re-load a component that is inside the form? Your form doesn't have a submit button, nor an action or a method, and nothing in your JS code executes a submit. How exactly do you expect it to be submitted? It is not clear what you are trying to achieve.

Anthony

[Jason Solack]

i'm expecting behave like an ajax call similar to this:

           var jqxhr = $.post(baseUrl() + "default/test", $('form').serialize())

            .done(function(data) {
                 .....

            })

i'm writing a single page application and don't want to submit for the form in the tradition sense, i want to pass the form via the ajax call

[Anthony]

This is still not clear. What is in /chart/test.load? Is there a form in there? If so, just use that and forget the outer form you have created, which is useless? If not, what form are you trying to submit?

If you want to submit a form via Ajax, then create an Ajax component, and put the entire form in the component. In that case, the form will be submitted via Ajax automatically.

Anthony