This is what I have come up with that works.
In the function widget of the class:
public function widget($args, $instance) {
if (isset($instance)) {
//$title = apply_filters( 'widget_title', $instance[ 'title' ] );
//$blog_title = get_bloginfo( 'name' );
//$tagline = get_bloginfo( 'description' );
} else {
$title="Just My Size";
}
global $selectedevent;
global $event;
global $events;
global $wpdb;
global $event2;
write_log('gdd before_widget');
$events = $wpdb->get_results("SELECT id, event FROM mo_events order by event", ARRAY_A);
write_log('gdd Build form');
?>
<form name="f1" method="POST" action="process_post.php">
<fieldset>
<legend> Select an Event </legend>
<select class="dropdown" id="eventsdd" name="eventsdropdown" title="Events Dropdown" onclick="doclick(this)" >
<?php write_log('gdd foreach');?>
<?php foreach ($events as $event) {
?> <option value=" <?php echo $event['id'] ?>"><?php echo $event['event']; ?> </option>
<?php } ?>
</select>
<p>
<input type="text" id="hideme">
<input type="text" id="ename" name="EVENT" value = "" placeholder="Select an existing or enter a new event">
</p>
<p>
<label id="label4" for="DESCRIPTION">Description</label>
<textarea rows="5" cols="50" form="f1" name="DESCRIPTION" placeholder="Describe the event" id="DESCRIPTION"></textarea>
</p>
<input type="submit" id='submit_id' name="submit_id"</input>
</fieldset>
<?php
echo $args['after_widget'];
write_log('gdd after_widget');
}
And the javascript code:
<script>
function isset(_var){
return !!_var; // converting to boolean.
}
var eventId;
var xmlhttp;
var xmlhttp = new XMLHttpRequest;
function doclick(ddl){
$evtid=-1;
$evtid =ddl.options[ddl.selectedIndex].value;
document.getElementById('hideme').value =
ddl.options[ddl.selectedIndex].value;
document.getElementById('ename').value =
ddl.options[ddl.selectedIndex].text;
xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = callback;
xmlhttp.open("POST", "http://www.memoriesof.website/id.php", true);
xmlhttp.send();
}
function callback(){
if(xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById('DESCRIPTION').innerHTML = xmlhttp.responseText;
}
}
</script>