jQWidgets Forums

Forum Replies Created

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

Author

Posts

November 4, 2012 at 6:42 am in reply to: href link in jqxMenu built from JSON data href link in jqxMenu built from JSON data #10501

zohaib

Member

Hi Dimitar,

I got the solution and it is working for me.

I have set url in li attribute and get attribute using JQuery using ID.

Following is the solution example.


<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<ul>
	<li url="http://www.google.com" id="1">Google</li>
	<li url="http://www.yahoo.com" id="2">Yahoo</li>
	<li url="http://www.bing.com" id="3">Bing</li>
	<li url="http://www.facebook.com" id="4">Facebook</li>
	<li url="http://www.amazon.com" id="5">Amazon</li>
</ul>
<script>
$(function() {
    alert($('#3').attr('url'));
	var url = $('#'+event.args.id).attr('url');
	header_url(url);
  });
function header_url(url)
{
	window.parent.location=url;
} 
</script>
</body>
</html>

– Thanks
Zohaib.

November 1, 2012 at 8:36 am in reply to: href link in jqxMenu built from JSON data href link in jqxMenu built from JSON data #10382

zohaib

Member

Hi Dimitar,

Thanks for reply.

My idea when user click on menu OR submenu then call javascript and redirect using window.parent.location=url;

This solution will work for 30 to 50 more menu and sub menu items.

Writing if condition and redirecting will need lot of code as we need to write if condition for each menu or submenu (30 to 50 more)

JSON menu page navigation.

This solution will be helpful for other users and community with less code.

If you know any way to get url value of selected menu item in itemclick event will be great.

– Thanks
Zohaib.

November 1, 2012 at 5:15 am in reply to: href link in jqxMenu built from JSON data href link in jqxMenu built from JSON data #10333

zohaib

Member

Hi Dimitar,

If I set url in li element then it is possible alert in itemclick function event.

Any idea?


<ul class="jqx-widget-content jqx-menu-dropdown" style="overflow: hidden; position: absolute; left: 0px; display: inherit; top: -256px; margin-left: 0px; padding-left: 2px;">
			<li url="http://www.google.com" id="3" item-label="رسالة الاكاديمية" class="jqx-item jqx-menu-item jqx-rc-all">رسالة الاكاديمية</li>
			<li url="http://www.google.com" id="4" item-label="اعضاء مجلس ادارة الاكاديمية" class="jqx-item jqx-menu-item jqx-rc-all">اعضاء مجلس ادارة الاكاديمية</li>
			<li url="http://www.google.com" id="5" item-label="الرؤية الرسالة الاكاديمية" class="jqx-item jqx-menu-item jqx-rc-all">الرؤية الرسالة الاكاديمية</li>
			<li url="http://www.google.com" id="6" item-label="استراتيجيتنا" class="jqx-item jqx-menu-item jqx-rc-all">استراتيجيتنا</li>
			<li url="http://www.google.com" id="7" item-label="ضمان الجودة" class="jqx-item jqx-menu-item jqx-rc-all">ضمان الجودة</li>
			<li url="http://www.google.com" id="8" item-label="حقائق و أرقام" class="jqx-item jqx-menu-item jqx-rc-all">حقائق و أرقام</li>
			<li url="http://www.google.com" id="9" item-label="حقائق و لوائح" class="jqx-item jqx-menu-item jqx-rc-all">حقائق و لوائح</li>
			<li url="http://www.google.com" id="10" item-label="دليل الاتصال" class="jqx-item jqx-menu-item jqx-rc-all">دليل الاتصال</li>
			<li url="http://www.google.com" id="11" item-label="موقع الاكاديمية" class="jqx-item jqx-menu-item jqx-rc-all">موقع الاكاديمية</li>
		</ul>

– Thanks
Zohaib.

October 31, 2012 at 9:03 am in reply to: href link in jqxMenu built from JSON data href link in jqxMenu built from JSON data #10273

zohaib

Member

Hi Dimitar,

Many thanks for reply and solution.

Now url attribute is set.

How can I alert url of selected item from menu using itemclick function.

Any Idea?

I try following but no success. 🙁

 // prepare the data
                var source =
                {
                    datatype: "json",
                    datafields: [
                        { name: 'id' },
                        { name: 'parentid' },
						{ name: 'url' },
                        { name: 'text' },
                        { name: 'subMenuWidth' }
                    ],
                    id: 'id',
					url: 'url',
                    localdata: data
                };
 
                // create data adapter.
                var dataAdapter = new $.jqx.dataAdapter(source);
                // perform Data Binding.
                dataAdapter.dataBind();
                // get the menu items. The first parameter is the item's id. The second parameter is the parent item's id. The 'items' parameter represents 
                // the sub items collection name. Each jqxTree item has a 'label' property, but in the JSON data, we have a 'text' field. The last parameter 
                // specifies the mapping between the 'text' and 'label' fields.  
                var records = dataAdapter.getRecordsHierarchy('id', 'parentid','items', [{ name: 'text', map: 'label'}],'url');
                $('#jqxWidget').jqxMenu({ source: records, height: 30, theme: theme, width: '800px' });
                $("#jqxWidget").bind('itemclick', function (event) 
				{
                    alert(event.args.id);
					alert(event.args.url);
					/*
					var htmlElement = event.args.element;
					var item = $('#jqxWidget').jqxMenu('getItem', htmlElement);
					var parentId = item.parentId;
					alert(parentId);
					/*
					alert(event.args.url);
					alert($(event.args).url());
					*/
					//alert($(event.args).url()); 
					var url ="http://www.google.com";
					header_url(url);
					//$("#eventLog").html("Id: " + event.args.id + ", Text: " + $(event.args).text());
                });

October 31, 2012 at 8:20 am in reply to: href link in jqxMenu built from JSON data href link in jqxMenu built from JSON data #10270

zohaib

Member

Hi Dimitar,

I have added one attribute name “url” in JSON data.

I want to access this attribute in itemclick event and alert url same like id and text.

Following code shows url added in JSON data and alert in itemclick event.

Do you have any idea?

"id": "2",
"parentid": "1",
"url": "www.google.com",
"text": "Sub Menu2"

$("#jqxWidget").bind('itemclick', function (event) 
{
	alert(event.args.id);
	alert($(event.args).text());
	//alert($(event.args).url()); 
	test();
	//$("#eventLog").html("Id: " + event.args.id + ", Text: " + $(event.args).text());
});

– Thanks
Zohaib.

October 29, 2012 at 9:02 am in reply to: href link in jqxMenu built from JSON data href link in jqxMenu built from JSON data #10138

zohaib

Member

Hi Dimitar,

Thanks for reply.

I can see for each menu item I need to specify url in itemclick event.

I have menu of around 30 to 40 submenu.

It will be difficult to write if condition for each menu and sub menu item.

Can we have “href” or “URL” attribute in JSON data and based on it will work. OR any other modular way.

– Thanks
Zohaib.

October 18, 2012 at 9:45 am in reply to: RTL direction for jqxTree built from JSON data. RTL direction for jqxTree built from JSON data. #9677

zohaib

Member

Hi Dimitar,

thanks for reply.

sorry forgot to mention in last post that I have created customtheme.css file and using it for RTL direction.

– Thanks
Zohaib.

October 18, 2012 at 8:41 am in reply to: RTL direction for jqxTree built from JSON data. RTL direction for jqxTree built from JSON data. #9672

zohaib

Member

Hi Dimitar,

I got 90% success in making text direction from right to left for tree using JSON data.

I change CSS for float:right, direction:rtl, text-align:right etc.

I am facing small problem as my tree moving when I close all nodes of root.

If you have any solution will be great.

– Thanks
Zohaib.

October 18, 2012 at 8:31 am in reply to: How to get parentid of selected record How to get parentid of selected record #9671

zohaib

Member

Hi Dimitar,

Many thanks for information.

🙂

– Thanks
Zohaib.

October 16, 2012 at 10:57 am in reply to: How to get parentid of selected record How to get parentid of selected record #9536

zohaib

Member

Hi Dimitar,

Any solution about this?

– Thanks
Zohaib.

October 16, 2012 at 10:10 am in reply to: RTL direction for jqxTree built from JSON data. RTL direction for jqxTree built from JSON data. #9532

zohaib

Member

Thanks Dimitar for information.

– Thanks
Zohaib.

October 16, 2012 at 8:08 am in reply to: RTL direction for jqxTree built from JSON data. RTL direction for jqxTree built from JSON data. #9513

zohaib

Member

Hi Dimitar,

Thanks for reply.

jQWidgets team has intelligent developer.

I am ready to pay for solution.

There should be some way.

– Thanks
Zohaib.

October 11, 2012 at 5:10 am in reply to: Dynamically Generate JSON Data. Dynamically Generate JSON Data. #9224

zohaib

Member

JSON Menu Example Data

Author

Posts

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