Quantcast
Channel: Recent Discussions — DataTables forums
Viewing all articles
Browse latest Browse all 82109

no checkboxes?

$
0
0
Hi there,

Now that I'm able to load up DataTables with data from multiple tables using Join, I'm trying to figure out why I'm not getting a bunch of checkboxes for my last field labelled "Hobby" when I go to open the Edit or Create dialog form. When I return the JSON string, I append all the options from the hobbies table in the database, so it looks like so:

{... {"DT_RowId":"527","LASTNAME":"Boulton","FIRSTNAME":"Lee-Ann","mobile":{"MOBILE_NUMBER":"719-5459","TYPE":"blackberry"},"hobbies":[]},{"DT_RowId":"722","LASTNAME":"Bar","FIRSTNAME":"Foo","mobile":{},"hobbies":[]},{"DT_RowId":"725","LASTNAME":"Abreham","FIRSTNAME":"Andrew","mobile":{},"hobbies":[]},{"DT_RowId":"728","LASTNAME":"Goodwill","FIRSTNAME":"Ziggy","mobile":{},"hobbies":[]}],"hobbyoptions":[{"value":"1","label":"sports"},{"value":"2","label":"crafts"},{"value":"3","label":"photography"},{"value":"4","label":"sewing"},{"value":"5","label":"models"},{"value":"6","label":"reading"}]}

Notice the array labelled "hobbyoptions"? This is supposed to be read in by the JavaScript. See below:

var editor; // use a global for the submit and return data rendering in the examples

	$(document).ready(function() {
                              
		editor = new $.fn.dataTable.Editor( {
			"ajaxUrl": "http://localhost:8080/JQuery/join2.jsp",
			"domTable": "#employees",
			"fields": [ {
				"label": "LASTNAME:",
				"name": "LASTNAME",
				"type": "text"
			}, {
				"label": "FIRSTNAME:",
				"name": "FIRSTNAME",
				"type": "text"
			}, {
				"label": "MOBILE:",
				"name": "mobile.MOBILE_NUMBER",
				"type": "text"
			}, {
				"label": "MOBILE TYPE:",
			                "name": "mobile.TYPE",
				"type": "text"
			}, {
				"label": "HOBBY:",
				"name": "hobbies.NAME",
				"type": "checkbox"
			}
		]
	} );

	$('#employees').dataTable( {
		"sDom": "Tfrtip",
		"sAjaxSource": "http://localhost:8080/JQuery/join2.jsp",
                                     
		"aoColumns": [
			{ "mData": "LASTNAME" },
			{ "mData": "FIRSTNAME" },
			{ "mData": "mobile.MOBILE_NUMBER",
                                               "sDefaultContent": "" },
			{ "mData": "mobile.TYPE",
                                                  "sDefaultContent": "" },
                                                { "mData": "hobbies",
                                                  "sDefaultContent": "",
                                                  "mRender": "[, ].NAME"}						
		],
		"oTableTools": {
			"sRowSelect": "single",
			"aButtons": [
				{ "sExtends": "editor_create", "editor": editor },
				{ "sExtends": "editor_edit",   "editor": editor },
				{ "sExtends": "editor_remove", "editor": editor }
			]
		},
                               "fnInitComplete": function ( settings, json ) {
                               // Set the allowed values for the select and radio fields based on
                              // what is available in the database
                             editor.field('hobbyoptions[].value').update( json.hobbies);
                                 }
	} );
} );


Have I got the fnInitComplete thing right? Please advise.

Alan

Viewing all articles
Browse latest Browse all 82109

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>