I have a CB set up with a title and a few options.
TITLE
-1
-2
-3
-4
When I click on the text "TITLE" the CB goes in to text edit mode. I want to find a way to prevent this.
Hello seang,
Thank you for contacting Infragistics!
I may need more information from you. Please attach a copy of the CB definition together with your reply.
If you have any questions, please let me know as well.
Hi, I dont follow you? I'm asking a question in general not a code questioning. I have some proprietary code if you want to see what I'm doing with it but nothing isolated.
I'm referring to the (nullText: name,) part of the code. Seems I can edit that by clicking on the CB, I just want it to be a static label.
/** * @file menue.js * @author Sean Green <seang@sctflash.com> * @company SCT * * @section LICENSE see SCT_JQapi.js * * * * @section menu class */ var menue = ( function() { // A constructor. /* \param IUDiv: referace to the UI div for igniteui engine \param windowDiv: referace to the movable window \param inX: window position and size. \param inY: "" \param inWindowDiv: div for window \param name: name of window \param item(x): attems to add creates a menu */ function menue( inIUDiv, inX, inY, inWindowDiv, outerDiv, id, name, item1, item2, item3, item4, item5, item6, item7, item8, item9, item10 ) { var INSTANCE = this; this.copyData = null; this.copyColumnKey = null; this.copyInfo = null; //defults this.checkedSelections = "true:false"; this.windowMode = 0; this.clearWindowResize = "false"; var menuItems = new Array(); for ( i = 1; i < 11; i++ ) { //if constructor passed in data, display it. if ( eval( "item" + i ) ) menuItems.push( { "item": eval( "item" + i ) } ); } this.applyPrefs(); var delay = ( function () { var timer = 0; return function ( callback, ms ) { clearTimeout( timer ); timer = setTimeout( callback, ms ); }; } )(); $( window ).resize( function () { delay( function ()//need to set this to avoide bad slugish-ness { outerDiv.style.left = window.innerWidth - ( id * 120 ) - 10 + "px"; outerDiv.style.top = _menuHeight + "px"; }, 180 ); } ); makeWindow( inWindowDiv, inX, inY, 1, 1 )//set up windows size bar and position. $.ig.loader( function () { inIUDiv.igCombo( { dataSource: menuItems, virtualization: true, nullText: name, textKey: "item", valueKey: "item", width: "120px", autoComplete: true, selectionChanged: function ( evt, ui ) { switch( ui.items[0].text.substring(0,4) ) { case "Copy": INSTANCE.copyData = _currentWindowPinned.selectionData; INSTANCE.copyInfo = _currentWindowPinned.selectionCopyInfo; break; case "Past": _currentWindowPinned.paste( INSTANCE.copyData, INSTANCE.copyInfo )//_currentWindowPinned.selectionCopyInfo break; case "Sele"://select all for ( var i = _currentWindowPinned.gridIDMap.allRows().length + 1; i > -1; i-- ) { for ( var j = _currentWindowPinned.gridIDMap.option( "columns" ).length - 1; j > 0 ; j-- ) { _currentWindowPinned.igGridSelection.selectCell( i, j ); } } if ( document.getElementById( "myDiv" + _currentWindowPinned.ID + "_table__" ) ) document.getElementById( "myDiv" + _currentWindowPinned.ID + "_table__" ).className = "ui-widget-header-leftCell";//rid that green select break; case "Pref": if ( document.getElementById( 'preferenceBox' ) ) { document.body.removeChild( document.getElementById( 'preferenceBox' ) ); return } var preferenceBox = document.createElement( 'div' ); preferenceBox.setAttribute( 'style', 'position:fixed; top:' + 100 + 'px; left:' + 510 + 'px; z-index:' + 2000 ) preferenceBox.setAttribute( 'id', 'preferenceBox' ); preferenceBox.setAttribute( 'class', 'preferenceBox' ); ecu = new ECU(); var data = ecu.DataReader( "?userID=0" ); var checks = ""; var a1, a2, b1, b2; if ( data != '""' ) { data = data.substring( 1, data.length - 1 )//rid "" data = data.split( "," );//get the catagories checks = data[0].split( ":" );//get the checks if ( checks[0] == "true" ) { a1 = "checked"; a2 = ""; } else { a1 = ""; a2 = "checked"; } if ( checks[1] == "true" ) { b1 = "checked"; b2 = ""; } else { b1 = ""; b2 = "checked"; } } else {//no pref file checks = INSTANCE.checkedSelections.split( ":" );//get the checks if ( checks[0] == "true" ) { a1 = "checked"; a2 = ""; } else { a1 = ""; a2 = "checked"; } if ( checks[1] == "true" ) { b1 = "checked"; b2 = ""; } else { b1 = ""; b2 = "checked"; } } preferenceBox.innerHTML = '<FORM NAME="Pref">' + '<TABLE border="4" > ' + '</td><td> Item </td><td>Explination<br> </td><td class2="table">Yes/No<br>' + '<br>' + '</tr><tr><td> 1 <br>' + '</td><td class="table1"> Clear contents when resizing windows. <br>' + '</td><td><input type="radio" name="radio1" id = "radio1" ' + a1 + ' ><input type="radio" name="radio1" ' + a2 + '><br>' + '</tr><tr><td> 2 <br>' + '</td><td class="table1"> Do this and that . <br>' + '</td><td><input type="radio" name="radio2" id = "radio2" ' + b1 + '><input type="radio" name="radio2" ' + b2 + '><br>' + '<br>' + '</tr><tr><td> <br></td><td class="table2" ><input id="OK" type="button" value="Save"/> <br></td><td > <input type="button" value="Cancel" onClick="document.body.removeChild( preferenceBox )" /><br>' + '</td></tr></table></td></tr></table>' form = document.body.appendChild( preferenceBox ); var form = document.getElementById( "OK" ); form.onclick = function () { INSTANCE.doSave( INSTANCE ); } INSTANCE.clearWindowResize = true; break; } inIUDiv.igCombo( "selectedIndex", -1 );//clear selection - no need to leave that selected in the menues inIUDiv.igCombo( "activeIndex", -1 ); } } ); } ); }; // menue.prototype.doCopy(); // menue.prototype.doPaste(); menue.prototype.doSave = function ( I ) { var data = document.getElementById( 'radio1' ).checked + ":" + document.getElementById( 'radio2' ).checked + "," data = data + ( document.getElementById( 'themeSelector' ).value - 1 ).toString() + "," data = data + document.getElementById( 'myTree' ).style.fontSize //update check to relect live I.clearWindowResize = document.getElementById( 'radio1' ).checked ///blahh - checks[1]; ecu = new ECU(); var data = ecu.DataWriter( "?userID=0&data=" + data ); document.body.removeChild( preferenceBox ); this.applyPrefs(); }; menue.prototype.applyPrefs = function () { //apply preferences ecu = new ECU(); var data = ecu.DataReader( "?userID=0" ); if ( data != '""' ) { data = data.substring( 1, data.length - 1 )//rid "" data = data.split( "," );//get the catagories checkedSelections = data[0]; var checks = data[0].split( ":" );//get the checks this.clearWindowResize = ( checks[0] == "true" ) ? true : false; ///blahh - checks[1]; this.windowMode = data[1]; $( document.getElementById( 'myFontSlider' ) ).slider( { value: data[2].substring(0,2) } ); document.getElementById( 'myTree' ).style.fontSize = data[2]; var elmt = document.getElementById( 'themeSelector' ) elmt.value = this.windowMode; document.getElementById( 'themeSelector' ).selectedIndex = this.windowMode; document.getElementById( 'myTree' ).setAttribute( 'class', 'box_' +elmt.options[this.windowMode].text ); document.getElementById( 'myShortcutBar' ).setAttribute( 'class', 'shortcutbar box_' + elmt.options[this.windowMode].text) document.getElementById( 'myInfoBox' ).setAttribute( 'class', 'box_' + elmt.options[this.windowMode].text) } else {//no pref file } } return menue;})();
Hello Seang,
Thank you for the code and additional information. You may include "Title" as part of an image. And set the background-image of the input area of the CB.
Perfect solution thank you.