Wordpress Shortcode associated js not working - javascript

I have a plugin that creates a shortcode that outputs a form onto the page. There is nothing overly special about the form its self (just a bunch of html echo'd out). Where I am running into issues is when I need to manipulate that html with js. For some reason if I try to enqueue and register the js, none of the dynamic properties I need the form to have work but if I just put the js directly below the shortcode then everything works as expected. I normally wouldn't care if I had to do this for just esthetic js but I will also need this form to make an ajax call when the the submit button is pressed and I don't know how to do that without properly enqueueing the script. Below is the class for the Form output and the class that will just enqueue all the scripts I need:
namespace mmUserPreference;
class Form
{
public function __construct()
{
add_shortcode('user_preference_form', array($this, 'user_preference_form_shortcode'));
}
public function user_preference_form_shortcode()
{
//the ../ is to keep the form submit on the first page level
$output = '<div class="user_preference_form_container">';
$output .= '<form id="user_preference" method="post">';
$output .= '<div class="top_nav_up">';
$output .= '<div class="top_nav_top_row">';
$output .= '<div class="form_title_up">Manage Your e-Alerts</div>';
$output .= '<div class="top_nav_up_right">';
$output .= '<div class="form_submit_up"><input type="submit" value="Save"></div>';
$output .= '<div class="form_collapse_up"><i class="fa fa-chevron-up rotate" aria-hidden="true"></i></div>';
$output .= '</div>';
$output .= '</div>';
$output .= '<ul class="tabs_up">';
$output .= '<li class="tab_link_up current" data-tab="topics">Topics</li>';
$output .= '<li class="tab_link_up" data-tab="stocks">Stocks</li>';
$output .= '</ul>';
$output .= '</div>';
$output .= '<div class="form_content_up">';
$output .= '<div id="topics" class="tab-content-up current">';
$output .= '<div class="row_up">';
$output .= '<div class="input_label_up"><input type="checkbox" name="stocks_field" value="true"> Stocks</div>';
$output .= '<div class="input_label_up"><input type="checkbox" name="us_economy_field" value="true"> U.S. Economy</div>';
$output .= '</div>';
$output .= '<div class="row_up">';
$output .= '<div class="input_label_up"><input type="checkbox" name="stock_market_today_field" value="true"> Stock Market Today</div>';
$output .= '<div class="input_label_up"><input type="checkbox" name="technology_article_field" value="true"> Technology Article</div>';
$output .= '</div>';
$output .= '<div class="row_up">';
$output .= '<div class="input_label_up"><input type="checkbox" name="global_markets_field" value="true"> Global Markets</div>';
$output .= '<div class="input_label_up"><input type="checkbox" name="top_news_field" value="true"> Top News</div>';
$output .= '</div>';
$output .= '<div class="row_up">';
$output .= '<div class="input_label_up"><input type="checkbox" name="nasdaq_field" value="true"> Nasdaq.com</div>';
$output .= '<div class="input_label_up"><input type="checkbox" name="investing_ideas" value="true"> Investing Ideas</div>';
$output .= '</div>';
$output .= '<div class="row_up">';
$output .= '<div class="input_label_up"><input type="checkbox" name="oil" value="true"> Oil</div>';
$output .= '<div class="input_label_up"><input type="checkbox" name="tech_stocks" value="true"> Tech Stocks</div>';
$output .= '</div>';
$output .= '</div>';
$output .= '<div id="stocks" class="tab-content-up">';
$output .= '<div class="row_up">';
$output .= '<div class="input_label_up"><input type="checkbox" name="aapl" value="true"> AAPL</div>';
$output .= '<div class="input_label_up"><input type="checkbox" name="lmt" value="true"> LMT</div>';
$output .= '</div>';
$output .= '<div class="row_up">';
$output .= '<div class="input_label_up"><input type="checkbox" name="ekso" value="true"> EKOS</div>';
$output .= '<div class="input_label_up"><input type="checkbox" name="noc" value="true"> NOC</div>';
$output .= '</div>';
$output .= '<div class="row_up">';
$output .= '<div class="input_label_up"><input type="checkbox" name="ups" value="true"> UPS</div>';
$output .= '<div class="input_label_up"><input type="checkbox" name="tsla" value="true"> TSLA</div>';
$output .= '</div>';
$output .= '<div class="row_up">';
$output .= '<div class="input_label_up"><input type="checkbox" name="vz" value="true"> VZ</div>';
$output .= '<div class="input_label_up"><input type="checkbox" name="nvda" value="true"> NVDA</div>';
$output .= '</div>';
$output .= '<div class="row_up">';
$output .= '<div class="input_label_up"><input type="checkbox" name="awk" value="true"> AWK</div>';
$output .= '<div class="input_label_up"><input type="checkbox" name="rtn" value="true"> RTN</div>';
$output .= '</div>';
$output .= '</div>';
$output .= '</div>';
if(isset($_COOKIE['mmp_e'])) {
$output .= '<input type="hidden" name="email" value="' . $_COOKIE['mmp_e'] . '">';
} else {
$output .= '<input type="text" name="email" required><br> Please enter the email address you would like these updates to be sent to. <br>';
}
$output .= '</form>';
$output .= '</div>';
echo $output;
?>
<script>
// jQuery(document).ready(function($) {
// //for the user preference form tabs
// $('div.user_preference_form_container li.tab_link_up').click(function () {
// var tab_id = $(this).attr('data-tab');
//
// $('li.tab_link_up').removeClass('current');
// $('.tab-content-up').removeClass('current');
//
// $(this).addClass('current');
// $("#" + tab_id).addClass('current');
// });
//
// $('div.form_collapse_up').click(function () {
// $('.tabs_up').toggle('slow');
// $('.form_content_up').toggle('slow');
// $('.form_submit_up').toggle('slow');
// $('.form_collapse_up > .fa-chevron-up').toggleClass("down");
// });
// });
</script>
<?php
}
}
then to enqueue the scripts
namespace mmUserPreference;
class loadScripts
{
public function __construct()
{
add_action('wp_enqueue_scripts', array($this, 'loadScripts'));
}
public function loadScripts()
{
wp_register_script(
'user-preference-form-style-js',
plugins_url('../js/mm-user-preference-form-style.js', __FILE__),
array('jquery'),
null,
false);
wp_register_script(
'user-preference-form-submit-js',
plugins_url('../js/mm-user-preference-form-submit.js', __FILE__),
array('jquery'),
null,
true);
wp_register_style(
'user-preference-form-style-css',
plugins_url('../css/mm-user-preference-form.css', __FILE__)
);
wp_enqueue_script('user-preference-form-style-js');
wp_enqueue_script('user-preference-form-submit-js');
wp_enqueue_style('user-preference-form-style-css');
}
}
Then the main plugin file just looks something like this right now:
/*
Plugin Name: ******
Description: *****
Version: 1.0.0
Author: ******
License: GPL2
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/
include 'classes/Form.php';
include 'classes/loadScripts.php';
use mmUserPreference\Form;
use mmUserPreference\loadScripts;
use mmUserPreference\sendEmail;
use mmUserPreference\userQuery;
$userPrefScripts = new loadScripts();
$userPrefForm = new Form();
Any ideas where I am going wrong?

So for whatever reason I had to load my scripts at the 'wp_footer' hook in order for my shortcode to be effected by the js ie:
add_action('wp_footer', array($this, 'loadScripts'));

Related

Stack messageboard uploads compactly in order, one under eachother in rows of 5, but dont let tall images interfere

I have some kind of message board, users can add images, videos, markdown text.
How I want it to behave
I want items to align like in the image provided; move the blue element to the red area, as it should. the uploads (messages) are all the same width, but different heights, also, They are added by a PHP script which loops through a database and adds elements to the "message board" div, with the ".uploads" class.
if provided an image or video, theres an image or video, if not, theres only text.
home.php (shortened to the point...)
<?php
session_start();
// Check if user is logged in
if (isset($_SESSION['id']) && isset($_SESSION['user_name'])) {
?>
<!DOCTYPE html>
<body>
<div class="functions-holder">
<h1>Hello, <?php echo $_SESSION['name']; ?></h1>
<?php if (isset($_GET['msg'])) { ?>
<p class="message"><?php echo $_GET['msg']; ?></p>
<?php } ?>
Logout
<button onclick="openPopup()" class="fa-solid fa-plus" id="popUp"> Add post</button>
</div>
<div id="message-board"">
</div>
<script src="board.js"></script>
</body>
</html>
<?php
} else {
?>
<!-- ... pretty similar... -->
Sample of board.php
while ($row = $result->fetch_assoc()) {
$html .= '<div class="uploads">';
// Only display the delete button if the logged-in user is "chips"
if (isset($_SESSION['user_name']) && $_SESSION['user_name'] === "chips") {
$html .= '<button class="delete-button" data-id="' . $row['postid'] . '">Delete</button>';
}
$html .= '<h2>' . $row['author'] . ' shared</h2>';
$html .= '' . $row['markdown'] . '';
// Display the image if it exists and is not "noimg"
if ($row['img'] != '' && $row['img'] != 'noimg'){
$mimeType = mime_content_type($row['img']);
$fileType = explode('/', $mimeType)[0];
if (str_contains($fileType, 'image')){
$html .= '<img src="' . $row['img'] . '"/>';
}
else if (str_contains($fileType, 'video')){
$html .= '<video controls width="380" height="auto" src="' . $row['img'] . '"/>';
}
}
$html .= '</div>';
}
How could I do this using; HTML, CSS, and JAVASCRIPT
<html>
<head>
<title></title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.uploads {position: relative;float:left;width: 19%;border:1px dotted #000;margin:3px;height: 365px;width: 365px;background-color: #999;overflow: hidden;}
.uploads h2 {float:left;height: 30px;}
.uploads button {float:right;height: 30px;}
.uploads .markdown {float:left;clear: both;height: 20px;width: 100%;}
.uploads img {position: relative;float: none;display: block;clear: both;width:auto;height: auto;max-height: 285px; max-width: 330px;margin: 0px auto;clear: both;}
hr {width:100%;float:left;clear:both;}
</style>
</head>
<body>
<?php
$i=1;
$html = '';
while ($i<7) {
$html .= '<div class="uploads">';
// Only display the delete button if the logged-in user is "chips"
$html .= '<button class="delete-button" data-id="x' . $i . '">Delete</button>';
$html .= '<h2>xauthor shared</h2>';
$html .= '<div class="markdown">xmarkdown</div>';
// Display the image if it exists and is not "noimg"
$html .= '<img src="' . $i . '.png"/>';
// else if (str_contains($fileType, 'video')){
// $html .= '<video controls width="380" height="auto" src="' . $row['img'] . '"/>';
// }
$html .= '</div>';
if(($i%5)==0) {
$html .= '<br/><hr/><br/>';
}
$i++;
}
echo $html;
?>
</body>
</html>

HTML content is not being rendered in Visual Composer WordPress

I have implemented a short code to display the product search form in the page built using Visual Composer.
add_shortcode( 'sagar-custom-search', 'sagar_custom_search' );
function sagar_custom_search() {
$form = '<form role="search" method="get" id="searchform" action="' . esc_url( home_url( '/' ) ) . ' ">';
$form .= '<div>';
$form .= '<label class="screen-reader-text" for="s">' . __( 'Search for:', 'woocommerce' ) . '</label>';
$form .= '<input type="text" value="' . get_search_query() . '" name="s" id="s" placeholder="' . __( 'My Search form', 'woocommerce' ) . '" />';
$form .= '<input type="submit" id="searchsubmit" value="'. esc_attr__( 'Search', 'woocommerce' ) .'" />';
$form .= '<input type="hidden" name="post_type" value="product" />';
$form .= '</div>';
$form .= '</form>';
echo $form;
echo "sagar tamang";
}
The form can be seen using inspect but it is not being rendered. Can anybody help figure it out.

How to post/send form fields return by ajax to the server using jQuery $.post

Good day fellows, I'm displaying a form via ajax based on some drop downs menus. User can can select the class on one dropdown and subject on another, which in turn returns a list of students in that class.
This is formated in a form like manner that allows user to enter scores of subjects that a student have acquire. This is how the form looks after user have selected their preferences:
I want when the save button is click and after user have enter the score, it should be send to the database. I'm facing few problems:
When the score field is empty(since I added a required attribute) it doesn't validate that the field is empty, but rather send a request to the file that is responsible to insert records.
When the request reaches the file responsible to insert records(create_score.php) it's like no values were send through the form. I know this because I var_dump($_POST) and it return this array(0) { }
This is the script I'm using to return the file:
$(document).ready(function() {
$('#subject_id').on('change', function(){
var subject_id = $('#subject_id').val();
var class_id = $('#class_id').val();
var term = $('#term').val();
if (subject_id != '' || class_id != '') {
$.ajax({
url:"includes/ajax/read_student_score_form.php",
method:"post",
data:{"subject":subject_id, "class":class_id, "term":term},
dataType:"text",
success:function(data){
$("#result").html(data);
}
});
} else {
$("#result").html('');
}
});
$('#class_id').on('change', function(){
var subject_id = $('#subject_id').val();
var class_id = $('#class_id').val();
var term = $('#term').val();
if (subject_id != '' || class_id != '') {
$.ajax({
url:"includes/ajax/read_student_score_form.php",
method:"post",
data:{"subject":subject_id, "class":class_id, "term":term},
dataType:"text",
success:function(data){
$("#result").html(data);
}
});
} else {
$("#result").html('');
}
});
$('#term').on('change', function() {
/* Act on the event */
var subject_id = $('#subject_id').val();
var class_id = $('#class_id').val();
var term = $('#term').val();
if (subject_id != '' || class_id != '') {
$.ajax({
url:"includes/ajax/read_student_score_form.php",
method:"post",
data:{"subject":subject_id, "class":class_id, "term":term},
dataType:"text",
success:function(data){
$("#result").html(data);
}
});
} else {
$("#result").html('');
}
});
When the submit is click the is how I structure my code to post values to file responsible to insert records(create_score.php)
$(document).on('click', '#savebtn', function(event) {
event.preventDefault();
// this is where I'm testing if the button is working
alert("Button click");
console.log("Button click for console");
var form = $('#st_score_form');
var formdata = form.serialize();
$.post("includes/ajax/create_score.php", formdata)
.done(function(data){
$("#success").fadeIn('slow', function(){
$("#success").html('<div class="alert alert-info alert-dismissible"><button type="button" class="close" data-dismiss="alert" aria-hidden="true"><i class="glyphicon glyphicon-remove-circle"></i></button><b><i class="fa fa-check"></i>Alert! </b>'+data+'</div>');
});
})
.fail(function(data){
$("#success").fadeIn('slow', function(){
$("#success").html('<div class="alert alert-warning alert-dismissible"><button type="button" class="close" data-dismiss="alert" aria-hidden="true"><i class="glyphicon glyphicon-remove-circle"></i></button><b><i class="fa fa-warning"></i>Alert! </b>'+data+'</div>');
});
});
});
$('body').append('<button id="#savebtn"></button>');
This is how I'm returning the form(read_student_score_form.php):
if (mysqli_num_rows($result) > 0) {
# code...
$output .= '<h4 align="center">Periodic Report</h4>';
$output .= '<div class="table-responsive">
<table class="table table-bordered">
<tr>
<th scope="row" colspan="1">Subject</th>
<td colspan="5">'.$subject["subject_name"].'</td>
<th scope="row">Class</th>
<td>'.$class['class_name'].'</td>
<th scope="row">Period</th>
<td>'.$period.'</td>
</tr>';
$output .= '</table>';
$output .= '<table class="table table-bordered table-condensed table-responsive table-striped">
<thead>
<tr>
<th>Student</th>
<th>Score</th>
<th>Operations</th>
</tr>
</thead>';
$output .= '<tbody>';
while ($row = mysqli_fetch_array($result)) {
# code...
$output .= '<form action="#" method="post" id="st_score_form">';
// unseen fields values that will be send
$output .= '<tr style="display: none;">';
$output .= '<td><input type="text" name="student_id" value="'.$row['student_id'].'"></td>';
$output .= '<td><input type="text" name="subject_id" value="'.$subject_id.'"></td>';
$output .= '<td><input type="text" name="class_id" value="'.$class_id.'"></td>';
$output .= '<td><input type="text" name="term" value="'.$term.'"></td>';
$output .= '</tr>';
// -- end of unseen fields
$output .= '<tr>';
$output .= '<td>'.$row["first_name"]." ".substr($row["middle_name"], 0, 1).". ".$row["surname"].'</td>';
$output .= '<div class="form-group">';
$output .= '<td><input type="number" min="59" max="100" name="score" class="form-control" required="required"></td>';
$output .= '<td><input type="submit" name="savebtn" id="savebtn" value="Save" class="btn btn-info form-control"></td>';
$output .= '</div>';
$output .= '</tr>';
$output .= '</form>';
}
$output .= '</tbody>';
$output .= '</table>';
$output .= '</div>';
echo $output;
} else {
echo "Data not found";
}
Contents of file responsible to insert records (create_score.php)
if (isset($_POST)){
// just testing to see values posted
echo var_dump($_POST);
}
I'm open to feed backs and suggestions on ways I can make this work. Thanks!!!
UPDATE This is how I'm now displaying my form
$output .= '<form action="#" method="post" id="st_score_form">';
while ($row = mysqli_fetch_array($result)) {
# code...
// unseen fields values that will be send
$output .= '<tr style="display: none;">';
$output .= '<td><input type="text" id="student_id" name="student_id" value="'.$row['student_id'].'"></td>';
$output .= '<td><input type="text" name="subject_id" value="'.$subject_id.'"></td>';
$output .= '<td><input type="text" name="class_id" value="'.$class_id.'"></td>';
$output .= '<td><input type="text" name="term" value="'.$term.'"></td>';
$output .= '</tr>';
// -- end of unseen fields
$output .= '<tr>';
$output .= '<td>'.$row["first_name"]." ".substr($row["middle_name"], 0, 1).". ".$row["surname"].'</td>';
$output .= '<div class="form-group">';
$output .= '<td><input type="number" min="59" max="100" name="score" class="form-control" required="required"></td>';
$output .= '<td><input type="submit" name="savebtn" id="savebtn" value="Save" class="btn btn-info form-control"></td>';
$output .= '</div>';
$output .= '</tr>';
}
$output .= '</form>';
you have multiple elements with same ID, specificaly
id="savebtn"
first one is appended with jQuery, and second one comes over wire and you try to add that one too.. that can be a messy,, try to isolate or change the button refs, or classes,, try to switch to classes and ditch ID's once and for all, I did that long time ago and my life changed for the better :)
also,, for your issue number
1) try to add check same way you have for other event
$(document).on('click', '#savebtn', function(event) {
event.preventDefault();
var form = $('#st_score_form');
var formdata = form.serialize();
// check for value if not empty
var subject_id = $('#subject_id').val();
var class_id = $('#class_id').val();
var term = $('#term').val();
if (subject_id != '' || class_id != '') {
$.post("includes/ajax/create_score.php", formdata)
.done(function(data){
$("#success").fadeIn('slow', function(){
$("#success").html('<div class="alert alert-info alert-dismissible"><button type="button" class="close" data-dismiss="alert" aria-hidden="true"><i class="glyphicon glyphicon-remove-circle"></i></button><b><i class="fa fa-check"></i>Alert! </b>'+data+'</div>');
});
})
.fail(function(data){
$("#success").fadeIn('slow', function(){
$("#success").html('<div class="alert alert-warning alert-dismissible"><button type="button" class="close" data-dismiss="alert" aria-hidden="true"><i class="glyphicon glyphicon-remove-circle"></i></button><b><i class="fa fa-warning"></i>Alert! </b>'+data+'</div>');
});
});
}
});
for your issue number
2) when you get results from read_student_score_form.php page try to run this in your browser console to see if you have any results,,, that's before you try to send it to server,,
var form = $('#st_score_form');
var formdata = form.serialize();
run that, and get me your results here so maybe we can continue on this issue,,
UPDATE:
you are loop wrongly... take a look on your while in php and that one would render multiple <form action="#" method="post" id="st_score_form"> and that's wrong.. move it before while,, something like this:
<?php
$output .= '<form action="#" method="post" id="st_score_form">';
while ($row = mysqli_fetch_array($result)) {
} // end while
$output .= '</form>';

How to use javascript to activate the button when checkbox is checked?

I need for this php file a modification but I don't know javascript. This makes it really hard for me how to do it.
I want to do this:
If checkbox is checked than activate my submit button else don't activate them (default).
I already did some modifications:
I added the checkbox with id= checkbox and I added the parameter disabled="disabled" to my button.
This is working. Now I need only to activate the button when checkbox is checked.
But I have now 2 problems:
I don't know where to put the javascript code to my file
I don't know to I can call or activate javascript in my code
Would be really nice if someone could help me.
<?php
if(isset($_POST['photo-name'])){
$photo_name = $_POST['photo-name'];
}
if(isset($_POST['photo-title'])){
$photo_title = $_POST['photo-title'];
}
if(isset($_POST['photo-description'])){
$photo_description = $_POST['photo-description'];
}
if(empty($photo_name)){
$photo_name = '';
}
if(empty($photo_description)){
$photo_description = '';
}
$sql= $wpdb->get_results("SELECT name,id FROM ".$wpdb->prefix."u_gallery_cat ORDER BY name ASC");
$html .= '<div><label for="photo-name"><strong>'.__('Caption:','user-gallery').'</strong></label></div>';
$html .= '<div class="contest-input"><input type="text" name="photo-name" id="photo-name" value="'.$photo_name.'" /></div>';
$html .= '<div><label for="photo-content"><strong>'.__('Description:','user-gallery').'</strong> <span class="contest-small-font-2">'.__('(Optional)','user-gallery').'</span></label></div>';
$html .= '<div class="contest-input"><textarea class="photo-description-textarea" name="photo-description" id="photo-description">'.$photo_description.'</textarea></div>';
if(!empty($sql)){
$html .= '<div><label for="photo-category"><strong>'.__('Category:','user-gallery').'</strong></label></div>';
$html .= '<select name="photo-category" id="photo-category">';
foreach($sql as $item){
$html .= '<option value="'.$item->id.'">'.$item->name.'</option>';
}
$html .= '</select>';
}
if ($photo_limit == 100000000){
$html .= '<div><label for="user-photo"><strong>'.__('Select image:','user-gallery').'</strong></label></div>';
}else{
$html .= '<div><label for="user-photo"><strong>'.__('Select image: (max.','user-gallery').' '.$p_limit.')</strong></label></div>';
}
$html .= '<div class="contest-input"><input type="file" name="user-photo" id="user-photo" size="50" accept="image/*" onchange="loadFileU(event)" class="selimg"></div>';
$html .= '<img id="coutput"/>';
$html .= '<div class="ug-clear"></div>';
$html .= '<input type="hidden" name="user_id" />';
$html .= '<input type="hidden" name="action" value="new_post" />';
$html .= '<div class="contest-button-div">';
$html .= '<div class="contest-button"><input type="checkbox" name="chk" id="chk" value="yourvalue" class="checkbox"></div>';
$html .= '<div class="contest-button"><input type="submit" value="'.__('Add Photo','user-gallery').'" id="submit" disabled="disabled" name="submit" class="ug-styled-button tooglebutton" /></div>';
$html .= '<div class="ug-clear"></div>';
$html .= '</div>';
$html .= '<div class="ug-clear"></div>';
$html .= '</form>';
$html .= '<div class="ug-clear"></div>';
$html .= '</div>';
}
?>
Without using Jquery :
On your checkbox add a onchange() event to trigger Javascript:
<div class="contest-button"><input type="checkbox" name="chk" id="chk" value="yourvalue" class="checkbox" onchange="openSubmit()"></div>
Then for your script :
<script type="text/javascript">
function openSubmit(){ // This function is called by the checkbox click
if(document.getElementById('chk').checked == true){ // If it is checked
document.getElementById('submit').disabled = false; // Then we remove the disable attribute
}
</script>
Using Jquery :
$('#chk').change(function(){ // You put an event on your checkbox here
if($(this).is(':checked')){ // If statut of checkbox is checked
document.getElementById('submit').disabled = false; // Then we remove the disable attribute
}
});
You can put this script at the bottom of your file after your PHP.

jquery form results are not showing. Is my code wrong?

I am having difficulty with my form. On one of my pages is a form. You enter info, click submit, and it returns with some result. Well, it is supposed to return with a result. It appears to do nothing, currently. However, if I check the header responses in my developer tools, it does show the results. So I know they are being called correctly, they just are not appearing on the webpage.
Here is the calling code:
$content .= '
<script type="text/javascript">
var $j = jQuery.noConflict();
$j(window).load(function(){
$j("#pubverify-form").submit(function() {
var str = $j(this).serialize();
$j.ajax({
type: "POST",
url: "' . $cs_base_dir . 'verify.php",
data: str,
success: function(msg){
$j("#note").ajaxComplete(function(event, request, settings)
{
$j(this).html(msg);
});
}
});
return false;
});
});
</script>';
Here is the code that I believe should show the results:
$content .= '<div id="verify-a-rec" class="clear">';
$content .= '<div id="fields">';
$content .= '<h4>Verify A Recommendation</h4>';
$content .= '<div class="verify_search">';
$content .= '<form id="pubverify-form" action="">';
$content .= '<div class="label_wrap_verify"><label class="error" for="search_last_name">Last Name </label>';
$content .= '<div class="input_wrap_verify"><input name="search_last_name" type="text" id="search_last_name"/></div></div>';
$content .= '<div class="label_wrap_verify"><label class="error" for="search_dob">Birthdate (mm-dd-yyyy) </label>';
$content .= '<div class="input_wrap_verify"><input name="search_dob" type="text" id="search_dob"/></div></div>';
$content .= '<div class="label_wrap_verify"><label class="error" for="search_issue_date">Issue Date (mm-dd-yyyy)</label>';
$content .= '<div class="input_wrap_verify"><input name="search_issue_date" type="text" id="search_issue_date"/></div></div>';
$content .= '<div class="button_wrap"><input type="submit" value="Verify" class="button" id="pubverify-submit" /></div>';
$content .= '</form>';
$content .= '</div>';
$content .= '</div>';
$content .= '<div style="clear:both"></div>';
$content .= '<div id="note">';
$content .= '<p>Enter a Recommendation ID and click Verify!</p>';
$content .= '<div class="patient_wrapper">';
$content .= '<div class="results_label">First Name </div>';
$content .= '<div class="results_label">Last Name </div>';
$content .= '<div class="results_label">Date of Birth </div>';
$content .= '<div class="results_label">Issue Date </div>';
$content .= '<div class="results_label">Expiration Date </div>';
$content .= '<div class="results_label">Dr. Information </div>';
$content .= '</div>';
$content .= '</div>';
$content .= '</div>';
return $content;
Can someone please help!?
This part is wrong.
$j("#note").ajaxComplete(function(event, request, settings)
{
$j(this).html(msg);
});
You need to remove the ajaxComplete code.
$j.ajax({
type: "POST",
url: "' . $cs_base_dir . 'verify.php",
data: str,
success: function(msg){
$j("#note").html(msg);
}
});

Categories