{"id":50898,"date":"2020-11-18T03:01:56","date_gmt":"2020-11-17T17:01:56","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=50898"},"modified":"2020-11-18T17:59:00","modified_gmt":"2020-11-18T07:59:00","slug":"combobox-wikipedia-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/combobox-wikipedia-tutorial\/","title":{"rendered":"ComboBox Wikipedia Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.htm\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"ComboBox Wikipedia Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox_userdecides.jpg\" title=\"ComboBox Wikipedia Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">ComboBox Wikipedia Tutorial<\/p><\/div>\n<p>Yesterday&#8217;s <a title='ComboBox Form Tutorial' href='#cbft'>ComboBox Form Tutorial<\/a> progress combined with today&#8217;s involvement of &#8230;<\/p>\n<ul>\n<li><a target=_blank title='Wikipedia' href='http:\/\/wikipedia.org'>Wikipedia<\/a> &#8230; thanks &#8230; via &#8230;<\/li>\n<li>Inhouse PHP<\/li>\n<\/ul>\n<p> &#8230; and can open up our ComboBox Form Table web application to the idea that the user can decide the table column names.  How, pray tell?  Have you noticed how great <a target=_blank title='Wikipedia' href='http:\/\/wikipedia.org'>Wikipedia<\/a> is at lists?  There are lists of a huge number of concepts.   So, think of plural words and use the new &#8220;dot&#8221; link in the header label of our web application to define your comma separated list of column names, and we&#8217;ll use the new PHP <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.php_GETME\" title=\"combobox.php\">combobox.php<\/a> to see &#8220;whether it flies&#8221; with a list distilled back to the user in the dropdown within the table data row cell&#8217;s ComboBox&#8217;s div\/select element&#8217;s dropdown (ie. select) part.<\/p>\n<p>Along the way we&#8217;ve started down the road of some mappings to those option elements of those ComboBox dropdown parts, that being &#8230;<\/p>\n<p><code><br \/>\n&lt;option value=\"[WikipediaBasedURL]\"&gt;[WikipediaBasedLabel]&lt;\/option&gt;<br \/>\n<\/code><\/p>\n<p> &#8230; and in turn that has given us a pretty &#8220;static&#8221; (but none the less useful) &#8220;onchange&#8221; event logic idea to start using on ComboBox select (dropdown) element parts, as per &#8230;<\/p>\n<p><code><br \/>\nfunction woit(sthis) {<br \/>\nif (sthis.value.indexOf(String.fromCharCode(104) + String.fromCharCode(116) + String.fromCharCode(116) + String.fromCharCode(112)) == 0) { \/\/ absolute URL value<br \/>\n window.open(sthis.value,'_blank','top=100,left=100,width=600,height=600');<br \/>\n}<br \/>\n}<br \/>\n<\/code><\/p>\n<p>And on the recall analysis of form (ie. user interactions) report we can use <font size=1>(good &#8216;ol)<\/font> <a target=_blank title='DOM document.referrer informatioin from w3schools' href='https:\/\/www.w3schools.com\/jsref\/prop_doc_referrer.asp'>document.referrer<\/a> to <font color=blue>glean precise &#8220;name&#8221; in &#8220;name=value&#8221; paradigm alert box reporting<\/font>, those being those user defined column headings to the ComboxBox Form Table &#8230;<\/p>\n<p><code><br \/>\n&lt;script type='text\/javascript'&gt;<br \/>\n  var selc=\" \", seli=0, selcombov=[], retrep='';<br \/>\n  while (selc != '') {<br \/>\n    selc = location.search.split('selcombo' + seli + '=')[1] ? decodeURIComponent(location.search.split('selcombo' + seli + '=')[1].split('&')[0]) : '';<br \/>\n    if (selc != '') { selcombov.push('' + selc); retrep+='Value' + eval(1 + seli) + ' (set by user)=' + selc + String.fromCharCode(10); }<br \/>\n    seli++;<br \/>\n  }<br \/>\n  if (retrep != '') {<br \/>\n    <font color=blue>if (('' + document.referrer).indexOf('?topics=') != -1) {<br \/>\n      var cols=decodeURIComponent(('' + document.referrer).split('?topics=')[1]).split(',');<br \/>\n      for (var iiu=1; iiu&lt;=cols.length; iiu++) {<br \/>\n        retrep=retrep.replace('Value' + iiu + ' ', cols[eval(-1 + iiu)] + ' ');<br \/>\n      }<br \/>\n    }<\/font><br \/>\n    alert(retrep);<br \/>\n  }<br \/>\n&lt;\/script&gt;<br \/>\n<\/code> <\/p>\n<p>That being so, <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.js--GETME\">our changed external Javascript<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.js--GETME\">combobox.js<\/a> called by <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.html--GETME\">our changed parent HTML<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.html--GETME\">combobox.htm<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.htm\" title=\"Click picture\">web application<\/a> might be worth your re-analysis.<\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=_blank  href='\/\/www.rjmprogramming.com.au\/ITblog\/combobox-wikipedia-tutorial\/'>ComboBox Wikipedia Tutorial<\/a>.<\/p-->\n<hr>\n<p id='cbft'>Previous relevant <a target=_blank title='ComboBox Form Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/combobox-form-tutorial\/'>ComboBox Form Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.htm\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"ComboBox Form Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox_multidrop.jpg\" title=\"ComboBox Form Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">ComboBox Form Tutorial<\/p><\/div>\n<p>Yesterday&#8217;s <a title='ComboBox Primer Tutorial' href='#cbpt'>ComboBox Primer Tutorial<\/a> got us working with new ComboBox div\/select elements, but that was just a display mechanism, and not a &#8220;collection of data&#8221; mechanism.  We could code for dynamic select &#8220;onchange&#8221; event and div &#8220;onblur&#8221; event logics, which we may allow for into the future, but today&#8217;s work is to have our external Javascript work with a parent HTML that has a &#8230;<\/p>\n<ul>\n<li>form method=GET action=[&#8220;here&#8217;s looking at you kid&#8221;]<\/li>\n<li>table with a header (ie. th cells) row &#8230; and <\/li>\n<li>row with empty data cells (ie. td cells) &#8230;<br \/>\n<code><br \/>\n&lt;table border=20&gt;<br \/>\n&lt;tr&gt;&lt;th&gt;Integer&lt;\/th&gt;&lt;th&gt;Lowercase&lt;\/th&gt;&lt;th&gt;Uppercase&lt;\/th&gt;&lt;\/tr&gt;<br \/>\n&lt;tr&gt;&lt;td&gt;&lt;\/td&gt;&lt;td&gt;&lt;\/td&gt;&lt;td&gt;&lt;\/td&gt;&lt;\/tr&gt;<br \/>\n&lt;\/table&gt;<br \/>\n<\/code>\n<\/li>\n<li>form submit button<\/li>\n<\/ul>\n<p> &#8230; that can parrot back what a user selected for their ComboBox(es).  The external Javascript changes ensure &#8230;<\/p>\n<ul>\n<li>a mechanism now exists for multiple calls of the external Javascript from the parent HTML &#8230; exemplified by &#8230;<br \/>\n<code><br \/>\n&lt;script type='text\/javascript' src='combobox.js?ddlist=1,2,3,4' defer&gt;&lt;\/script&gt;<br \/>\n&lt;script type='text\/javascript' src='combobox.js?ddlist=a,b,c,d' defer&gt;&lt;\/script&gt;<br \/>\n&lt;script type='text\/javascript' src='combobox.js?ddlist=A,B,C,D' defer&gt;&lt;\/script&gt;<br \/>\n<\/code>\n<\/li>\n<li>and the default place to hold those resultant ComboBox div\/select elements is to <i>empty innerHTML<\/i> elements (such as those td data cells above) &#8230; and &#8230;<\/li>\n<li>ComboBox div\/select elements now get created with a &#8220;name&#8221; attribute (meaning selections are passed back to [here&#8217;s looking at you kid&#8221;]<\/li>\n<li>ComboBox div\/select elements now get class &#8220;combobox&#8221; applied to them to aid with parent HTML styling CSS such as &#8230;<br \/>\n<code><br \/>\n&lt;style&gt;<br \/>\n div.combobox { background-color:yellow; }<br \/>\n select.combobox { background-color:pink; width:95%; }<br \/>\n&lt;\/style&gt;<br \/>\n<\/code><br \/>\n &#8230; means they slot into place into the parent HTML form and be self-returnable (ie. action=[&#8220;here&#8217;s looking at you kid&#8221;])\n<\/li>\n<\/ul>\n<p> &#8230; so that there can be better practical use made of these ComboBox div\/select elements used by <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.js-GETME\">our changed external Javascript<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.js-GETME\">combobox.js<\/a> called by  <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/PHP\/Geographicals\/diff.php?one=http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.html-GETME\">our changed parent HTML<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.html-GETME\">combobox.htm<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.htm\" title=\"Click picture\">web application<\/a> &#8230;<\/p>\n<p><iframe style=\"height:300px;\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.htm\"><\/iframe><\/p>\n<p><!--p>You can also see this play out at WordPress 4.1.1's <a target=_blank  href='\/\/www.rjmprogramming.com.au\/ITblog\/combobox-form-tutorial\/'>ComboBox Form Tutorial<\/a>.<\/p-->\n<hr>\n<p id='cbpt'>Previous relevant <a target=_blank title='ComboBox Primer Tutorial' href='\/\/www.rjmprogramming.com.au\/ITblog\/combobox-primer-tutorial\/'>ComboBox Primer Tutorial<\/a> is shown below.<\/p>\n<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"ComboBox Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.gif\" title=\"ComboBox Primer Tutorial\"  style=\"float:left;\" \/><\/a><p class=\"wp-caption-text\">ComboBox Primer Tutorial<\/p><\/div>\n<p>Do you remember a blog posting a couple of days ago called <a target=_blank title='Favourites Poll Email Moderation Contenteditable Tutorial' href='https:\/\/www.rjmprogramming.com.au\/ITblog\/favourites-poll-email-moderation-contenteditable-tutorial\/'>Favourites Poll Email Moderation Contenteditable Tutorial<\/a> featuring &#8230;<\/p>\n<blockquote cite='https:\/\/www.rjmprogramming.com.au\/ITblog\/favourites-poll-email-moderation-contenteditable-tutorial\/'><p>\n<a target=_blank title='Global contenteditable attribute information from W3schools' href='https:\/\/www.w3schools.com\/tags\/att_global_contenteditable.asp'>contenteditable<\/a> global attribute <font color=red>magic<\/font>\n<\/p><\/blockquote>\n<p>?  Well, that started me rethinking on a very long-running personal desire with our web application work.  In the Windows early GUI desktop applications going back to VB.Net and C++ in the latter 1900 years there was a GUI control called <a target=_blank title='ComboBox' href='https:\/\/docs.microsoft.com\/en-us\/dotnet\/api\/system.windows.forms.combobox?view=net-5.0'>&#8220;ComboBox&#8221; (class)<\/a> that never failed to impress me.  It matches a lot of needs to be presented with a static list of choices in mind, but then want to extend that list as time and situation changes over time.  A &#8220;ComboBox&#8221; can handle it, it being that combination of &#8230;<\/p>\n<ul>\n<li>dropdown (static) list &#8230; and &#8230;<\/li>\n<li>textbox &#8220;extender&#8221;<\/li>\n<\/ul>\n<p> &#8230; all manageable sounding in today&#8217;s web application wooooorrrrrlllllld, especially, in our minds, having <a target=_blank title='HTML defer script attribute information from W3schools' href='https:\/\/www.w3schools.com\/tags\/att_script_defer.asp'>defer<\/a><br \/>\n and <a target=_blank title='Global contenteditable attribute information from W3schools' href='https:\/\/www.w3schools.com\/tags\/att_global_contenteditable.asp'>contenteditable<\/a> as useful concepts for the latter item above.  And so a &#8230;<\/p>\n<ul>\n<li>dropdown (select) element &#8230; nested within a &#8230;<\/li>\n<li>div contenteditable=true<\/li>\n<\/ul>\n<p> &#8230; paradigm is the basis for our <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.js_GETME\">combobox.js<\/a> external Javascript to feature an Object Oriented looking Javascript Class &#8230;<\/p>\n<p><code><br \/>\n\/\/ combobox.js<br \/>\n\/\/ External Javascript to extend some HTML like combobox.html allowing for a dynamically created HTML div element \"combobox\" (ie. dropdown + div contenteditable=true)<br \/>\n\/\/ November, 2020<br \/>\n\/\/ Called via ...<br \/>\n\/\/      &lt;script type='text\/javascript' src='combobox.js' defer&gt;&lt;\/script&gt;<br \/>\n\/\/   ... or dropdown populated example as per ...<br \/>\n\/\/      &lt;script type='text\/javascript' src='combobox.js?ddlist=Asia,Africa,Europe,North%20America,South%20America,Australia,Antarctica' defer&gt;&lt;\/script&gt;<br \/>\n<br \/>\nclass Droptext {<br \/>\n  constructor(combobox) {<br \/>\n    this.ele = document.createElement('div');<br \/>\n    this.ele.id = ('' + combobox).split(';')[0];<br \/>\n    if (('' + combobox).indexOf(';') != -1) {<br \/>\n      this.ele.setAttribute('data-dropinnards',  ('' + combobox).split(';')[1]);<br \/>\n      this.ele.setAttribute('data-optionval',  \"&lt;option value=''&gt;&lt;\/option&gt;\");<br \/>\n      this.ele.setAttribute('data-focusaway',  \"&lt;input style=position:absolute;top:-200px;left:-200px; type=text value=&gt;&lt;\/input&gt;\");<br \/>\n      this.ele.setAttribute('contenteditable', true);<br \/>\n      this.ele.innerHTML = ('' + combobox).split(';')[1]; \/\/ + \"&lt;input style=position:absolute;top:-200px;left:-200px; type=text value=&gt;&lt;\/input&gt;\";<br \/>\n    }<br \/>\n  }<br \/>\n  present() {<br \/>\n    return this.ele.outerHTML.replace('&gt;&lt;select', ' onblur=\" var odiv=event.target;  var optval=event.target.getAttribute(' + \"'\" + 'data-optionval' + \"'\" + ');  var fway=event.target.getAttribute(' + \"'\" + 'data-focusaway' + \"'\" + ');  var umytype=event.target.innerHTML;  var alltogether=event.target.getAttribute(' + \"'\" + 'data-dropinnards' + \"'\" + ').split(String.fromCharCode(60) + ' + \"'\" + '\/select' + \"'\" + ')[0]; if (umytype.trim().length == 0) {   odiv.innerHTML = event.target.getAttribute(' + \"'\" + 'data-dropinnards' + \"'\" + '); } else if (alltogether.indexOf(String.fromCharCode(62) + umytype + String.fromCharCode(60)) != -1) {   odiv.innerHTML = alltogether.replace(String.fromCharCode(62) + umytype + String.fromCharCode(60), ' + \"' selected'\" + ' + String.fromCharCode(62) + umytype + String.fromCharCode(60)) + event.target.getAttribute(' + \"'\" + 'data-focusaway' + \"'\" + ');   } else {  alltogether+=optval.replace(String.fromCharCode(39),  String.fromCharCode(39) + umytype).replace(String.fromCharCode(62), String.fromCharCode(62) + umytype);  alltogether+=String.fromCharCode(60) + ' + \"'\" + '\/select' + \"'\" + ' + String.fromCharCode(62); odiv.innerHTML = fway; odiv.innerHTML = alltogether.replace(String.fromCharCode(62) + umytype + String.fromCharCode(60), ' + \"' selected'\" + ' + String.fromCharCode(62) + umytype + String.fromCharCode(60)) + event.target.getAttribute(' + \"'\" + 'data-focusaway' + \"'\" + '); odiv.setAttribute(' + \"'\" + 'data-dropinnards' + \"'\" + ',alltogether); }  \" onkeypress=\" event.target.setAttribute(' + \"'\" + 'data-sofar' + \"'\" + ', event.target.innerHTML); \" onkeydown=\"  if (event.target.innerHTML.indexOf(String.fromCharCode(60)) != -1) { event.target.innerHTML=' + \"''\" + ';  } \"&gt;&lt;select');<br \/>\n  }<br \/>\n}<br \/>\n<br \/>\nclass Contents extends Droptext {<br \/>\n  constructor(combobox, mod) {<br \/>\n    if (('' + combobox) == '') {<br \/>\n      var iinn=0;<br \/>\n      while (document.getElementById('combobox' + iinn)) {<br \/>\n        iinn++;<br \/>\n      }<br \/>\n      combobox = 'combobox' + iinn;<br \/>\n    }<br \/>\n    super((combobox + ';' + mod));<br \/>\n    this.dropinnards = mod;<br \/>\n  }<br \/>\n  show() {<br \/>\n    return this.present() + \"&lt;input style=position:absolute;top:-200px;left:-200px; type=text value=&gt;&lt;\/input&gt;\"; \/\/ + ', it is a ' + this.dropinnards;<br \/>\n  }<br \/>\n}<br \/>\n<\/code><\/p>\n<p> &#8230; and middle<strike>man<\/strike>person external Javascript &#8230;<\/p>\n<p><code><br \/>\nvar ihs = \"\";<br \/>\nvar selconts = location.search.split('ddlist=')[1] ? (ihs + decodeURIComponent(location.search.split('ddlist=')[1].split('&')[0])).split(',') : (ihs + \"&lt;select&gt;&lt;option value=''&gt;&lt;\/option&gt;&lt;option value='Red'&gt;Red&lt;\/option&gt;&lt;option value='Blue'&gt;Blue&lt;\/option&gt;&lt;option value='Yellow'&gt;Yellow&lt;\/option&gt;&lt;\/select&gt;\").split(',');<br \/>\nif (document.head.innerHTML.replace('&ddlist=','?ddlist=').indexOf('?ddlist=') != -1) {<br \/>\n  ihs = decodeURIComponent(document.head.replace('&ddlist=','?ddlist=').innerHTML.split('?ddlist=')[1].split('&')[0].split('\"')[0].split(\"'\")[0]); \/\/ + ',';<br \/>\n  if (ihs.trim() != '') { selconts = ihs.split(','); }<br \/>\n}<br \/>\nif (selconts[0].indexOf('&lt;select') != 0) {<br \/>\n var selcont = \"&lt;select&gt;\";<br \/>\n for (var jiip=0; jiip&lt;selconts.length; jiip++) {<br \/>\n  if (selconts[jiip].indexOf('&lt;select') != 0) {<br \/>\n    selcont += '&lt;option value=\"' + selconts[jiip] + '\"&gt;' + selconts[jiip] + '&lt;\/option&gt;';<br \/>\n  }<br \/>\n }<br \/>\n selcont += \"&lt;\/select&gt;\";<br \/>\n mycombobox = new Contents(\"\", selcont);<br \/>\n} else {<br \/>\n mycombobox = new Contents(\"\", selconts[0]);<br \/>\n}<br \/>\nvar obody = document.body;<br \/>\nif (document.getElementById('demo')) {<br \/>\n  obody = document.getElementById('demo');<br \/>\n} else {<br \/>\n  var ofound = false;<br \/>\n  var obs = document.getElementsByTagName('div');<br \/>\n  for (var iip=0; iip&lt;obs.length; iip++) {<br \/>\n    if (obs[iip].innerHTML == '') {<br \/>\n     obody = obs[iip];<br \/>\n     ofound = true;<br \/>\n    }<br \/>\n  }<br \/>\n  if (!ofound) {<br \/>\n    obody.innerHTML += '&lt;div id=demo&gt;&lt;\/div&gt;';<br \/>\n    obody = document.getElementById('demo');<br \/>\n  }<br \/>\n}<br \/>\nobody.innerHTML += mycombobox.show();<br \/>\n<\/code><\/p>\n<p> &#8230; that suits the need of our proof of concept calling HTML <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.html_GETME\" title=\"combobox.html\">combobox.html<\/a> <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/combobox.html\" title=\"Click picture\">live run<\/a> code &#8230;<\/p>\n<p><code><br \/>\n&lt;!doctype html&gt;<br \/>\n&lt;html&gt;<br \/>\n&lt;head&gt;<br \/>\n&lt;script type='text\/javascript' src='combobox.js' defer&gt;&lt;\/script&gt;<br \/>\n&lt;\/head&gt;<br \/>\n&lt;body&gt;<br \/>\n&lt;div id='demo'&gt;&lt;\/div&gt;<br \/>\n&lt;\/body&gt;<br \/>\n&lt;\/html&gt;<br \/>\n<\/code><\/p>\n<p>Intervening at the &#8220;onkeydown&#8221; event of the hosting HTML div contenteditable=true is the essence of why the &#8220;ComboBox&#8221; can be <font size=1>(quite a bit, but not totally)<\/font> like that forerunner &#8220;ComboBox&#8221; VB.Net GUI control.<\/p>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d50881' onclick='var dv=document.getElementById(\"d50881\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/combobox\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d50881' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d50890' onclick='var dv=document.getElementById(\"d50890\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/form\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d50890' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n<hr>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d50898' onclick='var dv=document.getElementById(\"d50898\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/tag\/wikipedia\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d50898' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Yesterday&#8217;s ComboBox Form Tutorial progress combined with today&#8217;s involvement of &#8230; Wikipedia &#8230; thanks &#8230; via &#8230; Inhouse PHP &#8230; and can open up our ComboBox Form Table web application to the idea that the user can decide the table &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/combobox-wikipedia-tutorial\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,14,37],"tags":[176,1580,210,230,2928,2442,260,2988,342,3013,367,452,549,576,1525,2092,2010,1631,2337,875,932,997,1986,1075,1866,2334,3485,1238,1675,1319,1363,1431],"class_list":["post-50898","post","type-post","status-publish","format-standard","hentry","category-elearning","category-event-driven-programming","category-tutorials","tag-c","tag-cell","tag-class","tag-column","tag-combobox","tag-contenteditable","tag-control","tag-defer","tag-div","tag-document-referrer","tag-dropdown","tag-form","tag-gui","tag-html","tag-innerhtml","tag-multiple","tag-object-oriented-programming","tag-onchange","tag-onkeypress","tag-oop","tag-php","tag-programming","tag-proof-of-concept","tag-row","tag-select","tag-submit","tag-system-window-forms","tag-table","tag-textbox","tag-tutorial","tag-vb-net","tag-wikipedia"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/50898"}],"collection":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/comments?post=50898"}],"version-history":[{"count":11,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/50898\/revisions"}],"predecessor-version":[{"id":50923,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/50898\/revisions\/50923"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=50898"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=50898"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=50898"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}