jQWidgets Forums

Forum Replies Created

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

Author

Posts

July 17, 2015 at 10:34 am in reply to: Trigger Change Event Trigger Change Event #73873

srosam

Participant

Well that works perfectly.

I cant see why the code in my full solution isnt working.

 var ownerdataAdapter = new $.jqx.dataAdapter(ownersource, {
        formatData: function (data) {
            if ($('#owner').jqxComboBox("searchString") !== undefined) {
                data.filter = $('#owner').jqxComboBox("searchString");
                return data;
            }
            return null;
        }
    });

were using data.filter but this isnt being set as there is nothing in the searchString

July 17, 2015 at 8:37 am in reply to: Trigger Change Event Trigger Change Event #73860

srosam

Participant

In my DoSomething function im trying to set the value and then trigger the search, in this case calling the dataBind function.
Search is not called and nothing happens.

Thanks.

var dataAdapter = null;
		
		$(document).ready(function () {
            // prepare the data
            var source =
            {
                datatype: "jsonp",
                datafields: [
                    { name: 'countryName' },
                    { name: 'name' },
                    { name: 'population', type: 'float' },
                    { name: 'continentCode' },
                    { name: 'adminName1' }
                ],
                url: "http://api.geonames.org/searchJSON",
                data: {
                    featureClass: "P",
                    style: "full",
                    maxRows: 12,
                    username: "jqwidgets"
                }
            };

            dataAdapter = new $.jqx.dataAdapter(source,
                {
                    formatData: function (data) {
                        if ($("#jqxcombobox").jqxComboBox('searchString') != undefined) {
                            data.name_startsWith = $("#jqxcombobox").jqxComboBox('searchString');
                            return data;
                        }
                    }
                }
            );

            $("#jqxcombobox").jqxComboBox(
            {
                width: 250,
                height: 25,
                source: dataAdapter,
                remoteAutoComplete: true,
                autoDropDownHeight: true,               
                selectedIndex: 0,
                displayMember: "name",
                valueMember: "countryName",
                renderer: function (index, label, value) {
                    var item = dataAdapter.records[index];
                    if (item != null) {
                        var label = item.name + "(" + item.countryName + ", " + item.adminName1 + ")";
                        return label;
                    }
                    return "";
                },
                renderSelectedItem: function(index, item)
                {
                    var item = dataAdapter.records[index];
                    if (item != null) {
                        var label = item.name;
                        return label;
                    }
                    return "";   
                },
                search: function (searchString) {
                    dataAdapter.dataBind();
                }
            });
			
			$('#jqxcombobox').on('change', function(event) {
				alert("bob");
			});

        });
		
		var doSomething = function(){
			
			$("#jqxcombobox").val('be');
			dataAdapter.dataBind();
			//var search = $('#jqxcombobox').jqxComboBox('search');
			
			
		}

November 22, 2013 at 1:51 pm in reply to: Remove Item from MultiSelect Remove Item from MultiSelect #33158

srosam

Participant

Peter, I have tried with async set to false, same result.

I didnt mean to leave those ‘selectItem’ lines in.. i have removed them now.

Note that i am able to get data into my multiselect.
The issue is that i cannot remove the data items that i have selected..

[img]image[/img]

November 22, 2013 at 11:56 am in reply to: Remove Item from MultiSelect Remove Item from MultiSelect #33151

srosam

Participant

I was too quick to post.. The above IS working..

But when i use an api call to populate the data it dosent work.
I can not click the X to remove an item….


@using System.Collections.Generic
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title id='Description'>
        This sample illustrates the Multi Select feature of jqxComboBox. That feature allows the selection of multiple values from jqxComboBox.
    </title>
    <link rel="stylesheet" href="/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="/gettheme.js"></script>
    <script type="text/javascript" src="/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="/jqx-all.js"></script>
</head>
    <body>
        @foreach (var i in new List<int> {1, 2, 3, 4, 5, 6, 7, 8, 9})
        {
            var jqComboId = i + "combobox";
            
            <div id='content'>
                <script type="text/javascript">
    $(document).ready(function () {
        var theme = "";
        var countries = new Array("Afghanistan", "Albania", "Algeria", "Andorra", "Angola", "Antarctica", "Antigua and Barbuda", "Argentina", "Armenia", "Australia", "Austria", "Azerbaijan", "Bahamas", "Bahrain", "Bangladesh", "Barbados", "Belarus", "Belgium", "Belize", "Benin", "Bermuda", "Bhutan", "Uganda", "Ukraine", "United Arab Emirates", "United Kingdom", "United States", "Uruguay", "Uzbekistan", "Vanuatu", "Venezuela", "Vietnam", "Yemen", "Zambia", "Zimbabwe");
        
        var url = "http://json-generator.appspot.com/j/coQyuBgQWG?indent=4";
        // prepare the data
        var source =
        {
            datatype: "json",
            datafields: [
                { name: 'id' },
                { name: 'gender' }
            ],
            url: url,
            async: true
        };
        var dataAdapter = new $.jqx.dataAdapter(source);
        
        // Create a jqxComboBox
        $("#@jqComboId").jqxComboBox({
            source: dataAdapter, multiSelect: true, width: 350, height: 25, theme: theme,
            displayMember: "gender",
            valueMember: "id"
        });
        $("#@jqComboId").jqxComboBox('selectItem', 'United States');
        $("#@jqComboId").jqxComboBox('selectItem', 'Germany');
    });
                </script>
                <span style="font-size: 13px; font-family: Verdana;">Select countries</span>
                <div style="margin-top: 5px;" id='@jqComboId'>
                </div>
            </div>
        }
    </body>
</html>

November 22, 2013 at 9:03 am in reply to: Remove Item from MultiSelect Remove Item from MultiSelect #33133

srosam

Participant

hi. thanks for the quick reply.

i got it working.

this works.


@using System.Collections.Generic
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title id='Description'>
        This sample illustrates the Multi Select feature of jqxComboBox. That feature allows the selection of multiple values from jqxComboBox.
    </title>
    <link rel="stylesheet" href="/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="/gettheme.js"></script>
    <script type="text/javascript" src="/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="/jqx-all.js"></script>
</head>
    <body>
        @foreach (var i in new List<int> {1, 2, 3, 4, 5, 6, 7, 8, 9})
        {
            var jqComboId = i + "combobox";
            
            <div id='content'>
                <script type="text/javascript">  
            
                    $(document).ready(function() {
                        var theme = "";
                        var countries = new Array("Afghanistan", "Albania", "Algeria", "Andorra", "Angola", "Antarctica", "Antigua and Barbuda", "Argentina", "Armenia", "Australia", "Austria", "Azerbaijan", "Bahamas", "Bahrain", "Bangladesh", "Barbados", "Belarus", "Belgium", "Belize", "Benin", "Bermuda", "Bhutan", "Uganda", "Ukraine", "United Arab Emirates", "United Kingdom", "United States", "Uruguay", "Uzbekistan", "Vanuatu", "Venezuela", "Vietnam", "Yemen", "Zambia", "Zimbabwe");
                        // Create a jqxComboBox
                        $("#@jqComboId").jqxComboBox({ source: countries, multiSelect: true, width: 350, height: 25, theme: theme });
                        $("#@jqComboId").jqxComboBox('selectItem', 'United States');
                        $("#@jqComboId").jqxComboBox('selectItem', 'Germany');
                    });
                    
                </script>
                <span style="font-size: 13px; font-family: Verdana;">Select countries</span>
                <div style="margin-top: 5px;" id='@jqComboId'>
                </div>
            </div>
        }
    </body>
</html>

Author

Posts

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