2

I have a custom flipbox which is described in the accepted answer here: JQuery Mobile Custom Flipbox get selected value.

I'm struggling to set the initial value after the page is rendered my 'change-page' function is something like this:

changePage:function (page) {
    page.$el.attr('data-role', 'page');
    page.render();
    $('body').append(page.$el).trigger('create');
    $.mobile.changePage(page.$el, {changeHash:false});

}

As I use Backbone.js to manage the views and then I delegate the navigation to jQM.

I basically need to set the initial value of this input text field ( maybe there's a workaround)

the problem

1 Answer 1

2

Ok I figured this out myself and I'm willing to share the solution:

first of all the change page function is slightly different:

changePage:function (page) {
    page.$el.attr('data-role', 'page');
    //get rid of everything in the old page.
    page.remove();
    //render the page again
    page.render();
    $('body').append(page.$el).trigger('create');
    $.mobile.changePage(page.$el, {changeHash:false});

}

the remove call is necessary to get rid of every event listener you had in the old rendered HTML.

In every page that needs init parameters you can specify in the render function this:

render: function(){

....

this.$el.on('pageshow',this.initFields);

....

}

initFields: function(){                                       
   // put your jQuery code here (e.g. this.$el.find('foo').val('initValue');                                    
}

please note that this solution as of the jQM documentation is valid up to the 1.5.0 version of jQM, after that the pageshow event will not be triggered anymore.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.