[supportParticipant]

Hi Mike,

Thank you for the feedback.

It makes sense. We will add support in the next version for ‘html’ property and custom items height in the Tree, too. In this version, the items height is calculated automatically by a span tag that wraps each tree item but this seems to work correctly only for simple items but not for items with additional nested tags.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[supportParticipant]

Hi LarsM and rafi,

Basically, after the data is loaded into the Grid, it automatically renders the data records. However, If you are trying to request data from a different domain, the Grid will not be populated with data. This is due to the browser’s same-origin policy. The same-origin policy prevents a script loaded from one domain from getting or manipulating properties of a document from another domain. That is, the domain of the requested URL must be the same as the domain of the current Web page. This means that the browser isolates content from different origins to guard them against manipulation. In order to load JSON data located on another domain, we should use JSONP. Binding using JSONP will be supported in the next version and I will also post a link to an example in this thread when the feature is implemented.

Please feel free to write us, if you have any additional questions.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[supportParticipant]

Hi Mike,

To add ‘html’ item to the Tree widget, you can use this:

$('#jqxTree').jqxTree('addTo', { label: '<b>Item</b>' });

It is possible to insert only one item with the ‘addTo’ method.

To add a Tree item as a child of another item, you need to pass the parent element as a second parameter of the ‘addTo’ method.

  $('#jqxTree').jqxTree('addTo', { label: '<b>Item</b>' }, $('#home')[0]);

Best Regards,,
Peter Stoev

http://www.jqwidgets.com
jQWidgets Team

[supportParticipant]

Hi Mike,

Thank you for the feedback.

I tested the reported issue regarding the ‘width’ property and successfully reproduced it. We will fix it for the next build. As a temporary workaround which you can use:

$("#listbox").jqxListBox('beginUpdateLayout');
$("#listbox").jqxListBox({width: 400});
$("#listbox").jqxListBox('resumeUpdateLayout');

Best Regards,
Peter Stoev

http://www.jqwidgets.com
jQWidgets Team

[supportParticipant]

Hi Mike,

The width property of the ListBox can be set to a Number or a string like a Number + ‘px’ like (width: “250px”). Setting the width to ‘100%’ is not a valid value for the width property. I will create a new work item regarding this missing feature and we will implement it in a future version. As a workaround, you can try manually setting the ListBox’s width property to the parent div’s width. You can also bind to the ‘resize‘ event of the parent div and set the ListBox’s width in the event handler.

Hope this helps you.

Best Regards,
Peter Stoev

http://www.jqwidgets.com
jQWidgets Team

[supportParticipant]

Hi Mike,

In the current version, the ListBox’s source property is required to be set during the initialization or after that. Otherwise, the insertAt method will not work as it tries to insert an item in the source object.

If your ListBox is empty and you want to add the first item, you can dynamically set the source property:

$("#jqxWidget").jqxListBox({ source: source });

To dynamically add new items, you can use the ‘insertAt’ method:

For example:

var item = { html: "<b>Item</b>"};        
$("#jqxWidget").jqxListBox('insertAt', item, 0);

Best Regards,
Peter Stoev

http://www.jqwidgets.com
jQWidgets Team

[supportParticipant]

Hi Dimitri,

You can define the ComboBox’s source by setting its value and label members. The label member represents the display string.

Here’s how to bind the ComboBox and create its source object:

             var source = [
                    {value: "key1", label: "Label1"},
                    {value: "key2", label: "Label2"},
                    {value: "key3", label: "Label3"},
                    {value: "key4", label: "Label4"},
		        ];
                // Create a jqxComboBox
                $("#jqxComboBox").jqxComboBox({ source: source, width: '200px', height: '25px'});

Then to get the selected value, you can bind to the ‘select’ event and call the ‘getitem’ method. The method retrieves a ComboBox item that has value and label properties.

For example:

               $('#jqxComboBox').bind('select', function (event) {
                    var args = event.args;
                    var item = $('#jqxComboBox').jqxComboBox('getItem', args.index);
                    // get value.
                    var value = item.value;
                    // get label.
                    var label = item.label;
                });

Best Regards,
Ivan Penev

jQWidgets Team
http://www.jqwidgets.com

[supportParticipant]

Hi ijekov,

To change the item’s height, you can use the ListBox’s itemHeight property.

$("#ListBox").jqxListBox({itemHeight: 20});

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[supportParticipant]

Hi Liquemin,

To uncheck all items and clear the selection, you can use the following code:

var itemslength = $("#jqxWidget").jqxListBox('items').length;
for (i = 0; i < itemslength; i++) {
    $("#jqxWidget").jqxListBox('uncheckIndex', i, false);
}
$("#jqxWidget").jqxListBox('clearSelection', true);

I did not understand the second part of your question. What do you mean by “my code to bind the submit-button on the select-box it does’nt works, however to contact my database”? The button’s click callback function is not executed or the ajax call is not working as expected?

	$.ajax({
			type: "POST",
			url: "checkbox007.php",
		        data: value,
			dataType:'json',
	                success: function(){
			      $('#msg').fadeIn(200).show();
			}
	});

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[supportParticipant]

Hi Liquemin,

jqxListBox is initialized from DIV element. It cannot be initialized from Select element, but it can load the items of a Select element.

Here’s the modified source code:

<div id='content'>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#jqxlistbox").jqxListBox({ checkboxes: true, width: '150', height: '150', theme: '', scrollBarSize: 10 });
            $("#jqxlistbox").jqxListBox('loadFromSelect', 'Select');
            $('#submit').jqxButton({ theme: "" });
            $('#reset').jqxButton({ theme: "" });
        });
    </script>
    <div id='jqxWidget'>
        <div id='Div1'>
            <form id="htmlForm" action="checkbox007.php" method="post">
            <div id="jqxlistbox"></div>
            <select id="Select" style="display:none" multiple="multiple" name="zusatz[]">
                <option value='Ἀμφισσεύς%'>Ἀμφισσεύς</option>
                <option value='Δελφὸς%'>Δελφὸς</option>
                <option value='Βοήθωι%'>Βοήθωι</option>
                <option value='Λιλαιεὺς%'>Λιλαιεὺς</option>
                <option value='Ἀμφισσεύς%'>Ἀμφισσεύς</option>
                <option value='Δελφὸς%'>Δελφὸς</option>
                <option value='Βοήθωι%'>Βοήθωι</option>
                <option value='Λιλαιεὺς%'>Λιλαιεὺς</option>
                <option value='Ἀμφισσεύς%'>Ἀμφισσεύς</option>
                <option value='Δελφὸς%'>Δελφὸς</option>
                <option value='Βοήθωι%'>Βοήθωι</option>
                <option value='Λιλαιεὺς%'>Λιλαιεὺς</option>
            </select>
            <input id='submit' type="submit" />
            <input id='reset' type="reset" />
            </form>
        </div>
        <div id="msg">
        </div>
    </div>
</div>

As you can see, I created a new DIV element with id = “jqxlistbox” and passed this id to the jqxListBox constructor. I also loaded the items from the Select element into the ListBox and set its Display to none.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[supportParticipant]

Hi sushant,

You can use the ‘searchmode’ property.

For example:

$("#jqxComboBox").jqxComboBox({ searchmode: 'contains'});

See the ‘searchmode’ possible values: combobox api

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[supportParticipant]

Hi ijekov,

This issue was actually already fixed in the latest release. If you are not using jQWidgets 1.2.1, then could you upgrade to it and try to reproduce again?

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[supportParticipant]

Hi rafi,

To change the popup listbox’s height, you can use the dropDownHeight property.

Code example:

$("#jqxdropdownlist").jqxDropDownList({ dropDownHeight: 250 });

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[supportParticipant]

Hi mmorgan,

We have debugged the reported issue and we confirm it. It is related to the showTopLevelArrows option of the jqxMenu.

Demo: jquery-menu-open-direction.htm

Download Project: jquery-menu-open-direction.zip

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[supportParticipant]

Hi mmorgan,

Thank you for your interest in our products.

Unfortunately, mega-menu scenarios are not supported by jqxMenu. These menus are usually using DIV elements for the drop down contents instead of UL. We will definitely implement such mega menu widget in a future version of our suite and it will be implemented as a separate menu widget. We will keep this thread updated with information about this widget.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts