jQWidgets Forums

This topic contains 3 replies, has 2 voices, and was last updated by  baradhili 11 years, 4 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • buttongroup object not showing on form #52241

    baradhili
    Participant

    Hi All,
    I’m trying to puzzle this one out…

    I have a buttongroup running on my form, is presents correctly and if I add a bit of a debug I can see it being clicked and show which is selected.
    So far so good.. However when I try and submit the form, it simply doesn’t show up.. Running firebug it also doesn’t show in the DOM.

    Any ideas?

    Here is the code snippets:

    <div id='sexInput'>
    <button type="radio" name="sex" style="padding:4px 16px;" id="Male" value="Male">Male</button>
    <button type="radio" name="sex" style="padding:4px 16px;" id="Female" value="Female">Female</button>
    </div>
    

    and the JS:

    $("#sexInput").jqxButtonGroup(
    {
       mode: 'radio',
       theme: 'orange'
    });
    $('#sexInput').jqxButtonGroup('setSelection', 0);
    
    ...
    
          $('#testForm').submit(function() 
          {
            var frm = $('#testForm');
            frm.submit(function (ev) 
            {
              $.ajax({
                type: frm.attr('method'),
                url: frm.attr('action'),
                data: { Card: $('#CardInput').val(), firstname: $('#firstnameInput').val(), lastname: $('#lastnameInput').val(),
                      driveyrs: $('#driveyrsInput').val(),street: $('#streetInput').val(), suburb: $('#suburbInput').val(), state: $('#stateInput').val(),
                      zip: $('#zipInput').val(), email: $('#emailInput').val(), phone: $('#phoneInput').val(),
                      company: $('#companyInput').val(), veh_make: $('#veh_makeInput').val(), veh_model: $('#veh_modelInput').val(), veh_year: $('#veh_yearInput').val(),
                      interests: $('#interestsInput').val(),
                      birth: $('#birthInput').jqxDateTimeInput('val'), accept: $('#acceptInput').jqxCheckBox('val'), 
                      sex: $('#sexInput').jqxButtonGroup('getSelection')
                      },
                success: function (data) 
                {
                    alert('ok');
                }
            });
    
            ev.preventDefault();  
          });
          });
    buttongroup object not showing on form #52246

    baradhili
    Participant

    from the html tab I see this

    <div id="sexInput" class="jqx-widget-orange jqx-rc-all-orange jqx-buttongroup jqx-buttongroup-orange jqx-widget jqx-rc-all" aria-disabled="false" role="radiogroup">
    <div id="Male" class="jqx-button jqx-button-orange jqx-group-button-normal jqx-group-button-normal-orange jqx-fill-state-normal jqx-fill-state-normal-orange jqx-rc-tl jqx-rc-tl-orange jqx-rc-bl jqx-rc-bl-orange jqx-group-button-pressed jqx-group-button-pressed-orange jqx-fill-state-pressed jqx-fill-state-pressed-orange" style="padding: 4px 16px; margin-left: -1px; float: left;" role="radio">Male</div>
    <div id="Female" class="jqx-button jqx-button-orange jqx-group-button-normal jqx-group-button-normal-orange jqx-fill-state-normal jqx-fill-state-normal-orange jqx-rc-tr jqx-rc-tr-orange jqx-rc-br jqx-rc-br-orange" style="padding: 4px 16px; margin-left: -1px; float: left;" role="radio">Female</div>
    <div style="clear: both;"></div>
    </div>
    buttongroup object not showing on form #52247

    Peter Stoev
    Keymaster

    Hi baradhili,

    The solution is to add hidden INPUT tag after the Button Group, set its “name” attribute and update its value when the ButtonGroup’s selection is changed.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com

    buttongroup object not showing on form #52248

    baradhili
    Participant

    My workaround…
    create hidden field in form id=”genderInput”

    $("#sexInput").bind('buttonclick', function (event) {
                        var buttonindex = $('#sexInput').jqxButtonGroup('getSelection');
                        $("#genderInput").val(buttonindex);  
                    });

    Now teh hidden field is visible, even if I cannot submit the buttongroup data..

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.