Solution:
Here’s the jquery I use for that which I usually add to wp_enqueue_script js folder
$(document).ready(function(){
// grab the submits button ID. do not use <input type="submit"> inside the form. Use a button instead outside the form.
$("#submit2").click(function()
{
// grab the forms ID
$("#message").submit(function(e)
{
// add a loading image in place of your returning outcome
$("#simple-msg").html("sending...");
// serialize/combine all submitted fields into an array
var postData = $(this).serializeArray();
// set url based of action
var formURL = $(this).attr("action");
// set ajax parameters
$.ajax(
{
url : formURL,
type: "POST",
data : postData,
success:function(data, textStatus, jqXHR)
{
$("#simple-msg").html('<pre><code class="prettyprint">'+data+'</code></pre>');
},
error: function(jqXHR, textStatus, errorThrown)
{
$("#simple-msg").html('<pre><code class="prettyprint">AJAX Request Failed<br/> textStatus='+textStatus+', errorThrown='+errorThrown+'</code></pre>');
}
});
e.preventDefault(); //STOP default action
e.unbind();
});
$("#message").submit(); //SUBMIT FORM
});
});
I also updated your form with the needed fields, but keep in mind your forms action since you will need to make it point to the page that processes your form
<form name='message' id='message' class="contactusform" method="post" novalidate="novalidate" enctype="multipart/form-data" action="<?php echo plugins_url(); ?>/your-plugins-name/process.php">
<?php
if(isset($_SESSION['message']))
{
echo $_SESSION['message'];
unset($_SESSION['message']);
}
?>
<input type="hidden" name="action" value="add_foobar">
<input type="hidden" name="data" value="foobarid">
<label>Full Name:</label><input type="text" name="name" value="" required="">
<label>Phone Number:</label><input type"=text" name="telno" value="" required="">
<label>Email Address:</label><input type="email" name="email" value="" required="">
<label>Town:</label><input type"=text" name="town" value="" required="">
<label>Device:</label><select name="device" value="" required="">
<option selected="selected" value=""></option><option value="Not Sure">Not Sure</option><option selected="selected" value=""></option><option value="iPhone 3G">iPhone 3G</option><option value="iPhone 3GS">iPhone 3GS</option><option value="iPhone 4G">iPhone 4G</option><option value="iPhone 4S">iPhone 4S</option><option value="iPhone 5">iPhone 5</option><option value="iPhone 5C">iPhone 5C</option><option value="iPhone 5S">iPhone 5S</option><option value="iPhone 6">iPhone 6</option><option value="iPhone 6 Plus">iPhone 6 Plus</option><option selected="selected" value=""></option><option value="MacBook">MacBook</option><option value="MacBook Pro">MacBook Pro</option><option value="MacBook Air">MacBook Air</option><option selected="selected" value=""></option><option value="iMac">iMac</option><option selected="selected" value=""></option><option value="iPad 1">iPad 1</option><option value="iPad 2">iPad 2</option><option value="iPad 3">iPad 3</option><option value="iPad 4">iPad 4</option><option value="iPad Air">iPad Air</option><option value="iPad Air 2">iPad Air 2</option><option value="iPad Mini 1">iPad Mini 1</option><option value="iPad Mini 2">iPad Mini 2</option><option value="iPad Mini 3">iPad Mini 3</option><option selected="selected" value=""></option><option value="iPod Classic">iPod Classic</option><option value="iPod Mini">iPod Mini</option><option value="iPod Nano">iPod Nano</option><option value="iPod Shuffle">iPod Shuffle</option><option value="iPod Touch">iPod Touch</option>
</select>
<label>Message:</label><textarea name="msg" cols="30" rows="4" value="" required=""></textarea>
</form>
<input type='button' id='submit2' value='Send Message' />
<div id='simple-msg'></div>
Hope this helps.