1. We apologize for the slow support at the moment. Hugh (cheesegrits) is scheduled for some major back surgery this month to repair two ruptured discs which are severely hampering his ability to work, and one of our stalwart community support members is on vacation for the month. Please bear with us.

MochaUI popup issue

Discussion in 'Standard Support' started by pfleischman, Jul 28, 2011.

Thread Status:
Not open for further replies.
  1. pfleischman New Member

    Level: Community
    I am trying to have a form popup instead of just loading it on the page. Here is the working code for loading the form and passing the proper information via URL:

    Code (text):
    index.php?option=com_fabrik&c=form&task=form&fabrik=16&Communication___idjointoposts_raw={posts___id}&Communication___user_raw={posts___userid}&tmpl=component'
    &tmpl=component
    Here is my Javascrip trying to do the same thing:
    Code (text):
    var id = 'myNewPopupWin';

    var idjointoposts = $('posts___id');
    var userraw = $('posts___userid');

    var url = 'index.php?option=com_fabrik&view=form&fabrik=16&tmpl=component' + '&Communication___idjointoposts_raw=' + idjointoposts + '&Communication___user_raw=' + userraw;

    this.windowopts = {
                'id': id,
                title: 'Select',
                contentType: 'xhr',
                loadMethod: 'xhr',
                evalScripts:true,
                contentURL: url,
                width: 300,
                height: 320,
                'minimizable': false,
                'collapsible': true,
                onContentLoaded: function(){
                    oPackage.resizeMocha(id);
                }
            }

    ;
    var mywin = new MochaUI.Window(this.windowopts);
    However it wont update the dropdowns with the related record information. I tired and tried to do this myself, but I think I'm not getting how to push element data through javascript properly.
  2. pfleischman New Member

    Level: Community
    I wanted to mention that one element is USER and one is ID.
  3. pfleischman New Member

    Level: Community
  4. pfleischman New Member

    Level: Community
    This is where I've gotten to:

    Code (text):
    var id = 'myNewPopupWin';

    var url = 'index.php?option=com_fabrik&view=form&fabrik=16&_postMethod=ajax&tmpl=component';

    url = url + '&Communication___idjointoposts=' + $('posts___id').getText() + '&Communication___user=' + $('posts___userid');

    this.windowopts = {
                'id': id,
                title: 'Select',
                contentType: 'xhr',
                loadMethod: 'xhr',
                evalScripts:true,
                contentURL: url,
                width: 300,
                height: 320,
                'minimizable': false,
                'collapsible': true,
                onContentLoaded: function(){
                    oPackage.resizeMocha(id);
                }





            }






    ;
    var mywin = new MochaUI.Window(this.windowopts);
    but now it throws me an error in firebug of

    Code (text):
    $("posts___id") is null
    eval()1 (line 1)
    anonymous()element.js (line 122)
    anonymous()
     
    It seems to be pushing the 'userid' (which is a joomla user element) just fine, it's just the ID element that I cant pass.
  5. pfleischman New Member

    Level: Community
    - friendly bump - I'm just stuck and this seems so easy, I don't get why I can't make it work.
  6. cheesegrits Support Gopher

    Level: Community
    I'll need to see the page to be of any help.

    -- hugh
  7. pfleischman New Member

    Level: Community
    here are the details:

    here is the page:
    http://lostonthestreet.com/index.php/component/fabrik/details/10/46

    You have to login
    Username: patrick
    password: test

    After you login, visit the link and run your mouse over the small red "M" next to "email user" and that will trigger the script.

    I just want to fill in the user ID and the post ID from the form to the Mocha window.

    Here is my current Javascript:

    Code (text):
    var id = 'myNewPopupWin';

    var url = 'index.php?option=com_fabrik&view=form&fabrik=16&tmpl=component';

    url = url + '&Communication___idjointoposts_raw=' + $('posts___id').getValue();
    url = url + '&Communication___user_raw=' + $('posts___userid').getValue();

    this.windowopts = {
                'id': id,
                title: 'Select',
                contentType: 'xhr',
                loadMethod: 'xhr',
                evalScripts:true,
                contentURL: url,
                width: 300,
                height: 320,
                'minimizable': false,
                'collapsible': true,
                onContentLoaded: function(){
                    oPackage.resizeMocha(id);
                }
            }

    ;
    var mywin = new MochaUI.Window(this.windowopts);
    If you need admin login, I can PM you that.
  8. cheesegrits Support Gopher

    Level: Community
    OK, the problem is twofold:

    1) In the read-only details view, the element ID's have _ro appended. So $('posts___id') doesn't exist, it's $('posts___id_ro'). Likewise posts___userid.

    2) Doing a $('posts___id_ro').getValue(), or on userid_ro, still probably won't get you the value you want, as that's calling the Mootools extended object getvalue() method for whatever DOM element the Fabrik element ID is on (which varies by element type, depending on whether it's a type that has "sub options", like checkboxes, etc).

    When getting Fabrik element values, you should always use the Fabrik element object, like this:

    details_10.formElements['posts___id'].getValue()

    This will call the getValue() method from the actual Fabrik element class for that element type, which knows how to give you the actual value you want, regardless of the element type.

    The details_10 obviously varies from form to form. It'll be form_XX for form view, and details_XX for a details view. And the XX will be the numeric ID of your form (the number in the leftmost column of the main Forms tab on the backend).

    Note that you don't need to append _ro to the element name using this method.

    -- hugh
    1 person likes this.
  9. pfleischman New Member

    Level: Community
    I tried that before, but I guess my usage is wrong, this is what I've tried and firebug tells me that 'form_16 is undefined'. I attached a screen shot of the place where I am putting the javascript, if that helps.

    Code (text):

    var id = 'myNewPopupWin';

    var idjointoposts = form_16.formElements['posts___id'].getValue();
    var userraw = form_16.formElements['posts___userid'].getValue();

    var url = 'index.php?option=com_fabrik&view=form&fabrik=16&tmpl=component' + '&Communication___idjointoposts_raw=' + idjointoposts + '&Communication___user_raw=' + userraw;

    this.windowopts = {
                'id': id,
                title: 'Select',
                contentType: 'xhr',
                loadMethod: 'xhr',
                evalScripts:true,
                contentURL: url,
                width: 300,
                height: 320,
                'minimizable': false,
                'collapsible': true,
                onContentLoaded: function(){
                    oPackage.resizeMocha(id);
                }
            }

    ;
    var mywin = new MochaUI.Window(this.windowopts);
  10. pfleischman New Member

    Level: Community
    Screenshot for reference

    Attached Files:

  11. cheesegrits Support Gopher

    Level: Community
    You said:

    I said:

    If we're talking about the same page you pointed me at, with the details/10 in the URL ... it's details_10, not form_16.

    I did test that line of code I gave you above in the Firebug console on your page before I made my last post, and it works.

    -- hugh
  12. pfleischman New Member

    Level: Community
    I want to punch myself in the face

    I must have just done it wrong the first time and kept trying things. Thank you so much!
  13. pfleischman New Member

    Level: Community
    Final code to fix problem:

    Code (text):
    var id = 'myNewPopupWin';

    var idjointoposts = details_10.formElements['posts___id'].getValue();
    var userraw = details_10.formElements['posts___userid'].getValue();

    var url = 'index.php?option=com_fabrik&view=form&fabrik=16&tmpl=component' + '&Communication___idjointoposts_raw=' + idjointoposts + '&Communication___user_raw=' + userraw;

    this.windowopts = {
                'id': id,
                title: 'Select',
                contentType: 'xhr',
                loadMethod: 'xhr',
                evalScripts:true,
                contentURL: url,
                width: 300,
                height: 320,
                'minimizable': false,
                'collapsible': true,
                onContentLoaded: function(){
                    oPackage.resizeMocha(id);
                }
            }

    ;
    var mywin = new MochaUI.Window(this.windowopts);
  14. cheesegrits Support Gopher

    Level: Community
    Thanks for the update, appreciate the code snippet.

    NOTE - we're close to having the new Fabrik JS window manager ready, and will most likely be back porting it from 3.x to 2.x within the next week or so. We really have no choice about this, as per my previous comments about Mocha just being flat out broken for IE9/10, and no active development work on the MochaUI project.

    We'll probably carry on including the MochaUI libraries for a while, for backward compat with peoples custom JS. But at some point, you'll need to rewrite your code to use the new Fabrik window manager. Which won't be hard, as we're trying to keep it as plug-compatible as possible, to make our lives easier.

    -- hugh
Thread Status:
Not open for further replies.

Share This Page