I have been using a Wordpress template and I need to add one more input field as well as deleting two others. This is a file to submit and go to checking before going public.
I went to source file of the template and the submit file and to the template file, and commenting out the lines where those input fields are.
But IT DOESN'T TAKE EFFECT on the page. I inspect over and over the page and nothing is changed. Not even if add or delete other parts of the file and the html tags.
I used the css display:none for not to show, but I need to add one more input and anything that I do this file seems to take effect.
I really don't understand why. Is it better if I use Javascript and create the inner HTML? But how can I get it in the email after submiting?
If you can help me in any way, please!!
<?php
/*
* Edit Form
*/
global $inspiry_options;
$edit_property_id = intval( trim( $_GET['edit_property'] ) );
$target_property = get_post( $edit_property_id );
// check if passed id is a proper property post */
if ( !empty( $target_property ) && ( $target_property->post_type == 'property' ) ) {
// Check Author
$current_user = wp_get_current_user();
// check if current user is the author of property
if ( $target_property->post_author == $current_user->ID ) {
$property_meta = get_post_custom( $target_property->ID );
?>
<form id="submit-property-form" class="submit-form" enctype="multipart/form-data" method="post">
<div class="row">
<div class="col-md-6">
<div class="form-option">
<label for="inspiry_property_title"><?php _e('Property Title', 'inspiry'); ?></label>
<input id="inspiry_property_title" name="inspiry_property_title" type="text" class="required" value="<?php echo esc_attr( $target_property->post_title ); ?>" title="<?php _e('* Please provide property title!', 'inspiry'); ?>" autofocus required/>
</div>
<div class="form-option">
<label for="description"><?php _e('Property Description', 'inspiry'); ?></label>
<textarea name="description" id="description" cols="30" rows="5"><?php echo esc_textarea( $target_property->post_content ); ?></textarea>
</div>
</div>
<div class="col-md-6">
<div class="form-option">
<?php
$property_address = "";
if ( isset( $property_meta['REAL_HOMES_property_address'] ) && ! empty ( $property_meta['REAL_HOMES_property_address'][0] ) ) {
$property_address = $property_meta['REAL_HOMES_property_address'][0];
} else {
$property_address = $inspiry_options[ 'inspiry_submit_address' ];
}
$property_location = "";
if ( isset( $property_meta['REAL_HOMES_property_location'] ) && ! empty ( $property_meta['REAL_HOMES_property_location'][0] ) ) {
$property_location = $property_meta['REAL_HOMES_property_location'][0];
} else {
$property_location = $inspiry_options[ 'inspiry_submit_location_coordinates' ];
}
?>
<label for="address"><?php _e('Address', 'inspiry'); ?></label>
<input type="text" class="required" name="address" id="address" value="<?php echo esc_attr( $property_address ); ?>" title="<?php _e( '* Please provide a property address!', 'inspiry'); ?>" required/>
<div class="map-wrapper">
<button class="btn-default goto-address-button" type="button" value="address"><?php _e('Find Address', 'inspiry'); ?></button>
<div class="map-canvas"></div>
<input type="hidden" name="location" class="map-coordinate" value="<?php echo esc_attr( $property_location ); ?>" />
</div>
</div>
</div>
</div>
<!-- .row -->
<div class="row">
<div class="col-md-4">
<div class="form-option">
<label for="type"><?php _e('Type', 'inspiry'); ?></label>
<select name="type" id="type" class="search-select">
<?php inspiry_hierarchical_edit_options( $target_property->ID, 'property-type' ); ?>
</select>
</div>
</div>
<div class="col-md-4">
<div class="form-option">
<label for="city"><?php _e('Location', 'inspiry'); ?></label>
<select name="city" id="city" class="search-select">
<?php inspiry_hierarchical_edit_options( $target_property->ID, 'property-city' ); ?>
</select>
</div>
</div>
<div class="col-md-4">
<div class="form-option">
<label for="status"><?php _e('Status', 'inspiry'); ?></label>
<select name="status" id="status" class="search-select">
<?php inspiry_hierarchical_edit_options( $target_property->ID, 'property-status' ); ?>
</select>
</div>
</div>
</div>
<!-- .row -->
<div class="row">
<div class="col-md-4">
<div class="form-option">
<label for="bedrooms"><?php _e('Bedrooms', 'inspiry'); ?></label>
<input id="bedrooms" name="bedrooms" type="text" value="<?php if( isset( $property_meta['REAL_HOMES_property_bedrooms'] ) ) { echo esc_attr( $property_meta[ 'REAL_HOMES_property_bedrooms' ][0] ); } ?>" title="<?php _e('* Only numbers allowed!', 'inspiry'); ?>"/>
</div>
</div>
<div class="col-md-4">
<div class="form-option">
<label for="bathrooms"><?php _e('Bathrooms', 'inspiry'); ?></label>
<input id="bathrooms" name="bathrooms" type="text" value="<?php if( isset( $property_meta['REAL_HOMES_property_bathrooms'] ) ) { echo esc_attr( $property_meta[ 'REAL_HOMES_property_bathrooms' ][0] ); } ?>" title="<?php _e('* Only numbers allowed!', 'inspiry'); ?>"/>
</div>
</div>
<div class="col-md-4">
<div class="form-option">
<label for="garages"><?php _e('Garages', 'inspiry'); ?></label>
<input id="garages" name="garages" type="text" value="<?php if( isset( $property_meta['REAL_HOMES_property_garage'] ) ) { echo esc_attr( $property_meta['REAL_HOMES_property_garage'][0] ); } ?>" title="<?php _e('* Only numbers allowed!', 'inspiry'); ?>"/>
</div>
</div>
</div>
<!-- .row -->
<div class="row">
<div class="col-md-4">
<div class="form-option">
<label for="price"><?php _e('Sale OR Rent Price', 'inspiry'); ?></label>
<input id="price" name="price" type="text" value="<?php if( isset( $property_meta['REAL_HOMES_property_price'] ) ) { echo esc_attr( $property_meta['REAL_HOMES_property_price'][0] ); } ?>" title="<?php _e('* Only numbers allowed!', 'inspiry'); ?>"/>
</div>
</div>
<div class="col-md-4">
<div class="form-option">
<label for="size"><?php _e( 'Area', 'inspiry' ); ?></label>
<input id="size" name="size" type="text" value="<?php if( isset( $property_meta['REAL_HOMES_property_size'] ) ) { echo esc_attr( $property_meta['REAL_HOMES_property_size'][0] ); } ?>" title="<?php _e('* Only numbers allowed!', 'inspiry'); ?>"/>
</div>
</div>
</div>
<!-- .row -->
<div class="row">
<div class="col-md-4">
<div class="form-option">
<label for="property-id"><?php _e('Property ID', 'inspiry'); ?></label>
<input id="property-id" name="property-id" type="text" value="<?php if( isset( $property_meta['REAL_HOMES_property_id'] ) ) { echo esc_attr( $property_meta['REAL_HOMES_property_id'][0] ); } ?>" title="<?php _e('Property ID', 'inspiry'); ?>"/>
</div>
</div>
<div class="col-md-4">
<div class="form-option">
<label for="video-url"><?php _e('Virtual Tour Video URL', 'inspiry'); ?></label>
<input id="video-url" name="video-url" type="text" value="<?php if( isset( $property_meta['REAL_HOMES_tour_video_url'] ) ) { echo esc_attr( $property_meta['REAL_HOMES_tour_video_url'][0] ); } ?>" />
</div>
</div>
</div>
<!-- .row -->
<div class="row container-row">
<div class="col-lg-6">
<div class="form-option">
<div id="gallery-thumbs-container" class="clearfix">
<?php
$thumbnail_size = 'thumbnail';
$properties_images = rwmb_meta( 'REAL_HOMES_property_images', 'type=plupload_image&size='.$thumbnail_size, $target_property->ID );
$featured_image_id = get_post_thumbnail_id( $target_property->ID );
if( !empty( $properties_images ) ){
foreach( $properties_images as $prop_image_id => $prop_image_meta ) {
$is_featured_image = ( $featured_image_id == $prop_image_id );
$featured_icon = ( $is_featured_image ) ? 'fa-star' : 'fa-star-o';
echo '<div class="gallery-thumb">';
echo '<img src="'.$prop_image_meta['url'].'" alt="'.$prop_image_meta['title'].'" />';
echo '<a class="remove-image" data-property-id="'.$target_property->ID.'" data-attachment-id="' . $prop_image_id . '" href="#remove-image" ><i class="fa fa-trash-o"></i></a>';
echo '<a class="mark-featured" data-property-id="'.$target_property->ID.'" data-attachment-id="' . $prop_image_id . '" href="#mark-featured" ><i class="fa '. $featured_icon . '"></i></a>';
echo '<span class="loader"><i class="fa fa-spinner fa-spin"></i></span>';
echo '<input type="hidden" class="gallery-image-id" name="gallery_image_ids[]" value="' . $prop_image_id . '"/>';
if ( $is_featured_image ) {
echo '<input type="hidden" class="featured-img-id" name="featured_image_id" value="' . $prop_image_id . '"/>';
}
echo '</div>';
}
}
?>
</div>
<div id="drag-and-drop">
<div class="drag-drop-msg text-center">
<i class="fa fa-cloud-upload"></i> <?php _e('Drag and drop images here', 'inspiry'); ?>
<br/>
<span class="drag-or"><?php _e('OR', 'inspiry'); ?></span>
<br/>
<a id="select-images" class="drag-btn btn-default btn-orange" href="javascript:;"><?php _e('Select Images', 'inspiry'); ?></a>
</div>
</div>
<ul class="field-description list-unstyled">
<li><span>*</span><?php _e('An image should have minimum width of 850px and minimum height of 600px.', 'inspiry'); ?></li>
<li><span>*</span><?php _e('You can mark an image as featured by clicking the star icon, Otherwise first image will be considered featured image.', 'inspiry'); ?></li>
</ul>
<div id="plupload-container"></div>
<div id="errors-log"></div>
</div>
</div>
<div class="col-lg-6">
<div class="form-option">
<label class="fancy-title"><?php _e('What to display in agent information box ?', 'inspiry'); ?></label>
<ul class="agent-options list-unstyled">
<li>
<span class="radio-field">
<input id="agent_option_none" type="radio" name="agent_display_option" value="none" <?php if( isset( $property_meta['REAL_HOMES_agent_display_option'] ) && ( $property_meta['REAL_HOMES_agent_display_option'][0] == "none" ) ) { echo "checked"; } ?> />
<label for="agent_option_none"><?php _e('None', 'inspiry'); ?></label>
</span>
<small><?php _e('( Agent information box will not be displayed )', 'inspiry'); ?></small>
</li>
<li>
<span class="radio-field">
<input id="agent_option_profile" type="radio" name="agent_display_option" value="my_profile_info" <?php if( isset( $property_meta['REAL_HOMES_agent_display_option'] ) && ( $property_meta['REAL_HOMES_agent_display_option'][0] == "my_profile_info" ) ) { echo "checked"; } ?> />
<label for="agent_option_profile"><?php _e('My Profile Information', 'inspiry'); ?></label>
</span>
<?php
if( !empty( $inspiry_options[ 'inspiry_edit_profile_page' ] ) ) {
$edit_profile_url = get_permalink( $inspiry_options[ 'inspiry_edit_profile_page' ] );
if ( !empty( $edit_profile_url ) ) {
?>
<small>
<?php _e('( Edit Profile Information )', 'inspiry'); ?>
</small>
<?php
}
}
?>
</li>
<li>
<span class="radio-field">
<input id="agent_option_agent" type="radio" name="agent_display_option" value="agent_info" <?php if( isset( $property_meta['REAL_HOMES_agent_display_option'] ) && ( $property_meta['REAL_HOMES_agent_display_option'][0] == "agent_info" ) ) { echo "checked"; } ?> />
<label for="agent_option_agent"><?php _e( 'Display Agent Information', 'inspiry' ); ?></label>
</span>
<select name="agent_id" id="agent-selectbox">
<?php
if ( isset( $property_meta['REAL_HOMES_agents'] ) ) {
inspiry_generate_cpt_options( 'agent', $property_meta['REAL_HOMES_agents'][0] );
} else {
inspiry_generate_cpt_options( 'agent' );
}
?>
</select>
</li>
</ul>
</div>
<div class="form-option checkbox-option clearfix">
<input id="featured" name="featured" type="checkbox" <?php if( isset( $property_meta['REAL_HOMES_featured'] ) && ( $property_meta['REAL_HOMES_featured'][0] == 1 ) ) { echo 'checked'; } ?> />
<label for="featured"><?php _e('Mark this property as featured property', 'inspiry'); ?></label>
</div>
</div>
</div>
<!-- .row -->
<div class="row container-row">
<div class="col-lg-6">
<div class="form-option">
<label class="fancy-title"><?php _e('Features', 'inspiry'); ?></label>
<ul class="features-checkboxes-wrapper list-unstyled clearfix">
<?php
// Property Features
$property_features = get_the_terms( $target_property->ID, "property-feature" );
$property_features_ids = array();
if ( !empty( $property_features ) && !is_wp_error( $property_features ) ) {
foreach( $property_features as $feature ) {
$property_features_ids[] = $feature->term_id;
}
}
// All Features
$all_features = get_terms(
array(
"property-feature"
),
array(
'orderby' => 'name',
'order' => 'ASC',
'hide_empty' => false,
)
);
if ( !empty( $all_features ) && !is_wp_error( $all_features ) ) {
foreach ( $all_features as $feature ) {
echo '<li><span class="option-set">';
if( in_array( $feature->term_id, $property_features_ids ) ){
echo '<input type="checkbox" name="features[]" id="feature-' . $feature->term_id . '" value="' . $feature->term_id . '" checked />';
}else{
echo '<input type="checkbox" name="features[]" id="feature-' . $feature->term_id . '" value="' . $feature->term_id . '" />';
}
echo '<label for="feature-' . $feature->term_id . '">' . $feature->name . '</label>';
echo '</li>';
}
}
?>
</ul>
</div>
</div>
<div class="col-lg-6">
<div class="form-option">
<div class="inspiry-details-wrapper">
<label><?php _e( 'Additional Details', 'inspiry' ); ?></label>
<div class="inspiry-detail labels clearfix">
<div class="inspiry-detail-control"> </div>
<div class="inspiry-detail-title"><label><?php _e( 'Title','inspiry' ) ?></label></div>
<div class="inspiry-detail-value"><label><?php _e( 'Value','inspiry' ); ?></label></div>
<div class="inspiry-detail-control"> </div>
</div>
<!-- additional details container -->
<div id="inspiry-additional-details-container">
<?php
// output existing details
$additional_details = get_post_meta( $target_property->ID, 'REAL_HOMES_additional_details', true );
if( ! empty ( $additional_details ) ) {
foreach( $additional_details as $title => $value ) {
?>
<div class="inspiry-detail inputs clearfix">
<div class="inspiry-detail-control">
<i class="sort-detail fa fa-bars"></i>
</div>
<div class="inspiry-detail-title">
<input type="text" name="detail-titles[]" value="<?php echo esc_attr( $title ); ?>" />
</div>
<div class="inspiry-detail-value">
<input type="text" name="detail-values[]" value="<?php echo esc_attr( $value ); ?>" />
</div>
<div class="inspiry-detail-control">
<a class="remove-detail" href="#"><i class="fa fa-times"></i></a>
</div>
</div>
<?php
}
} else {
?>
<div class="inspiry-detail inputs clearfix">
<div class="inspiry-detail-control">
<i class="sort-detail fa fa-bars"></i>
</div>
<div class="inspiry-detail-title">
<input type="text" name="detail-titles[]" value="" />
</div>
<div class="inspiry-detail-value">
<input type="text" name="detail-values[]" value="" />
</div>
<div class="inspiry-detail-control">
<a class="remove-detail" href="#"><i class="fa fa-times"></i></a>
</div>
</div>
<?php
}
?>
</div><!-- end of additional details container -->
<div class="inspiry-detail clearfix">
<div class="inspiry-detail-control"> </div>
<div class="inspiry-detail-control">
<a class="add-detail" href="#"><i class="fa fa-plus"></i></a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- .row -->
<div class="row container-row">
<div class="col-xs-12">
<div class="form-option">
<?php wp_nonce_field( 'submit_property', 'property_nonce' ); ?>
<input type="hidden" name="action" value="update_property"/>
<input type="hidden" name="property_id" value="<?php echo esc_attr( $target_property->ID ); ?>"/>
<input type="submit" value="<?php _e('Update Property', 'inspiry'); ?>" class="btn-small btn-orange"/>
</div>
<div id="message-container"></div>
</div>
</div>
<!-- .row -->
</form>
<?php
} else {
inspiry_message( __( 'Oops','inspiry' ), __( 'It appears that, Provided property does not belong to you!', 'inspiry' ) );
}
} else {
inspiry_message( __( 'Oops','inspiry' ), __( 'It appears that, Provided property id is invalid!', 'inspiry' ) );
}
Sounds like a caching issue either browser or server side. Most likely server cache.
Clear browser cache by pressing ctrl+shift+r for PC.
If your web host uses a caching plugin you can try clearing the cache through the plugin interface in wp-admin. (I recommend disabling caching plugins during development.)
If that doesn't work and you have access to cPanel or whatever your host uses for backend there should be a way to do a "master flush" of the cache.
Either that or you aren't actually editing the correct template. Sometimes theme files will override the core files and it can be tricky to find the correct file.
Related
I have Two new fields here:
Its Number & Mauze but I am unable to see data in database:
The form gets submitted successfully but i cannot find the values of these two fields in my database
here's my code:
For form fields:
<div class="col-md-6">
<!-- custom text field -->
<label for='its' class="mycss1"><?php esc_html_e('ITS Number', 'masterstudy-lms-learning-management-system'); ?></label>
<input type="text"
name="its"
placeholder="Enter your ITS Number"
class="mycss"
kr-icon="fas fa-envelope"
required/>
</div>
<div class="col-md-6">
<!-- custom text field -->
<label for='mauze' class="mycss1"><?php esc_html_e('Enter your Mauze', 'masterstudy-lms-learning-management-system'); ?></label>
<input type="text"
name="mauze"
placeholder="Mauze"
class="mycss"
kr-icon="fas fa-envelope"
required/>
</div>`
for database connection:
<?php
if (isset($_POST['register'])) {
extract($_POST);
$servername = "localhost ";
$username = "root";
$password = "";
$dbname = "test";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$sql = "INSERT INTO `wp_usermeta` (its,mauze)
VALUES ('$its','$mazue')";
if ($conn->query($sql) === TRUE) {
header('Location: register.php');
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
$conn->close();
}
?>
Here's my full form data its an signup form
<?php
stm_lms_register_style('register');
enqueue_register_script();
$r_enabled = STM_LMS_Helpers::g_recaptcha_enabled();
$disable_instructor = STM_LMS_Options::get_option('register_as_instructor', false);
if ($r_enabled):
$recaptcha = STM_LMS_Helpers::g_recaptcha_keys();
endif;
$site_key = (!empty($recaptcha['public'])) ? $recaptcha['public'] : '';
if (class_exists('STM_LMS_Form_Builder')):
$additional_forms = STM_LMS_Form_Builder::register_form_fields();
$default_fields = STM_LMS_Form_Builder::profile_default_fields_for_register();
$register_form = $additional_forms['register'];
$become_instructor = $additional_forms['become_instructor'];
?>
<script>
window.profileDefaultFieldsForRegister = <?php echo sanitize_text_field(json_encode($default_fields)); ?>;
window.additionalRegisterFields = <?php echo sanitize_text_field(json_encode($register_form)); ?>;
window.additionalInstructorsFields = <?php echo sanitize_text_field(json_encode($become_instructor)); ?>;
</script>
<?php
endif;
?>
<div id="stm-lms-register"
class="vue_is_disabled"
v-init="site_key = '<?php echo stm_lms_filtered_output($site_key); ?>'"
v-bind:class="{'is_vue_loaded' : vue_loaded}">
<h3><?php esc_html_e('Sign Up', 'masterstudy-lms-learning-management-system'); ?></h3>
<form #submit.prevent="register()" class="stm_lms_register_wrapper">
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label class="heading_font"><?php esc_html_e('Username', 'masterstudy-lms-learning-management-system'); ?></label>
<input class="form-control"
type="text"
name="login"
v-model="login"
placeholder="<?php esc_html_e('Enter username', 'masterstudy-lms-learning-management-system'); ?>"/>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="heading_font"><?php esc_html_e('E-mail', 'masterstudy-lms-learning-management-system'); ?></label>
<input class="form-control"
type="email"
name="email"
v-model="email"
placeholder="<?php esc_html_e('Enter your E-mail', 'masterstudy-lms-learning-management-system'); ?>"/>
</div>
</div>
<div class="col-md-6">
<!-- custom text field -->
<label for='its' class="mycss1"><?php esc_html_e('ITS Number', 'masterstudy-lms-learning-management-system'); ?></label>
<input type="text"
name="its"
placeholder="Enter your ITS Number"
class="mycss"
kr-icon="fas fa-envelope"
required/>
</div>
<div class="col-md-6">
<!-- custom text field -->
<label for='mauze' class="mycss1"><?php esc_html_e('Enter your Mauze', 'masterstudy-lms-learning-management-system'); ?></label>
<input type="text"
name="mauze"
placeholder="Mauze"
class="mycss"
kr-icon="fas fa-envelope"
required/>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<label class="heading_font"><?php esc_html_e('Password', 'masterstudy-lms-learning-management-system'); ?></label>
<input class="form-control"
type="password"
name="password"
v-model="password"
placeholder="<?php esc_html_e('Enter password', 'masterstudy-lms-learning-management-system'); ?>"/>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="heading_font"><?php esc_html_e('Password again', 'masterstudy-lms-learning-management-system'); ?></label>
<input class="form-control"
type="password"
name="password_re"
v-model="password_re"
placeholder="<?php esc_html_e('Confirm password', 'masterstudy-lms-learning-management-system'); ?>"/>
</div>
</div>
<div v-for="(profileField, index) in profileDefaultFieldsForRegister" class="col-md-12">
<div class="form-group">
<label class="heading_font" v-html="profileField.label"></label>
<input class="form-control" v-if="index !== 'description'" type="text" v-model="profileField.value" :placeholder="profileField.placeholder" :required="profileField.required" />
<textarea class="form-control" v-if="index === 'description'" v-model="profileField.value" :placeholder="profileField.placeholder" :required="profileField.required"></textarea>
</div>
</div>
</div>
<div class="row additional-fields" v-if="additionalRegisterFields.length"
v-for="(field, index) in additionalRegisterFields">
<div class="col-md-12">
<div class="form-group">
<label class="heading_font" v-if="typeof field.label !== 'undefined'" v-html="field.label"></label>
<?php STM_LMS_Templates::show_lms_template('account/v1/form_builder/email'); ?>
<?php STM_LMS_Templates::show_lms_template('account/v1/form_builder/select'); ?>
<?php STM_LMS_Templates::show_lms_template('account/v1/form_builder/radio'); ?>
<?php STM_LMS_Templates::show_lms_template('account/v1/form_builder/textarea'); ?>
<?php STM_LMS_Templates::show_lms_template('account/v1/form_builder/checkbox'); ?>
<?php STM_LMS_Templates::show_lms_template('account/v1/form_builder/file', array('name' => 'register')); ?>
<div class="field-description" v-if="field.description" v-html="field.description"></div>
</div>
</div>
</div>
<transition name="slide-fade">
<div class="row" v-if="become_instructor && !additionalInstructorsFields.length">
<div class="col-md-6">
<div class="form-group">
<label class="heading_font"><?php esc_html_e('Degree', 'masterstudy-lms-learning-management-system'); ?></label>
<input class="form-control"
type="text"
name="degree"
v-model="degree"
placeholder="<?php esc_html_e('Enter Your Degree', 'masterstudy-lms-learning-management-system'); ?>"/>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<label class="heading_font"><?php esc_html_e('Expertise', 'masterstudy-lms-learning-management-system'); ?></label>
<input class="form-control"
type="text"
name="expertize"
v-model="expertize"
placeholder="<?php esc_html_e('Enter your Expertize', 'masterstudy-lms-learning-management-system'); ?>"/>
</div>
</div>
</div>
</transition>
<div class="row additional-fields" v-if="become_instructor && additionalInstructorsFields.length"
v-for="(field, index) in additionalInstructorsFields">
<div class="col-md-12">
<div class="form-group">
<label class="heading_font" v-if="typeof field.label !== 'undefined'" v-html="field.label"></label>
<?php STM_LMS_Templates::show_lms_template('account/v1/form_builder/email'); ?>
<?php STM_LMS_Templates::show_lms_template('account/v1/form_builder/select'); ?>
<?php STM_LMS_Templates::show_lms_template('account/v1/form_builder/radio'); ?>
<?php STM_LMS_Templates::show_lms_template('account/v1/form_builder/textarea'); ?>
<?php STM_LMS_Templates::show_lms_template('account/v1/form_builder/checkbox'); ?>
<?php STM_LMS_Templates::show_lms_template('account/v1/form_builder/file', array('name' => 'becomeInstructor')); ?>
<div class="field-description" v-if="field.description" v-html="field.description"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<?php STM_LMS_Templates::show_lms_template('gdpr/privacy_policy'); ?>
<?php do_action('stm_lms_register_custom_fields'); ?>
<div class="stm_lms_register_wrapper__actions">
<?php ?>
<?php if (!$disable_instructor): ?>
<label class="stm_lms_styled_checkbox">
<span class="stm_lms_styled_checkbox__inner">
<input type="checkbox"
name="become_instructor"
v-model="become_instructor"/>
<span><i class="fa fa-check"></i> </span>
</span>
<span><?php esc_html_e('Register as Instructor', 'masterstudy-lms-learning-management-system'); ?></span>
</label>
<?php endif; ?>
<button type="submit"
class="btn btn-default"
:disabled="loading"
v-bind:class="{'loading': loading}">
<span><?php esc_html_e('Register', 'masterstudy-lms-learning-management-system'); ?></span>
</button>
</div>
</div>
</div>
</form>
<transition name="slide-fade">
<div class="stm-lms-message" v-bind:class="status" v-if="message">
{{ message }}
</div>
</transition>
</div>
<?php
if (isset($_POST['register'])) {
extract($_POST);
$servername = "localhost ";
$username = "root";
$password = "";
$dbname = "test";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$sql = "INSERT INTO `wp_usermeta` (its,mauze)
VALUES ('$its','$mazue')";
if ($conn->query($sql) === TRUE) {
header('Location: register.php');
} else {
echo "Error: " . $sql . "<br>" . $conn->error;
}
$conn->close();
}
?>
I have a form with a series of fields I want to make repeating. I have operational code however when I click on any remove button other than the first my code re-arranges the fields in the row like so:
My code is shown below, I think I'm going wrong with the :first selectors????
<div class="row">
<div class="col-12">
<div id="repeatingTides" class="row">
<div class="col-md-2 col-lg-4 tidePort">
<div class="form-group ">
<label for="tidePort">Tide Port</label>
<input type="text" id="tidePort" name="tidePort[]" class="form-control <?php echo (!empty($data['formData']['tidePort_error'])) ? 'is-invalid' : ''; ?>" value="<?php echo $data['formData']['tidePort']; ?>"/>
<span class="invalid-feedback"><?php echo $data['formData']['tidePort_error']; ?></span>
</div>
</div>
<div class="col-md-5 col-lg-4 tideHW">
<label for="hwTime">HW Time & Height</label>
<div class="input-group ">
<input type="time" id="hwTime" name="hwTime[]" class="form-control <?php echo (!empty($data['formData']['hwTime_error'])) ? 'is-invalid' : ''; ?>" value="<?php echo $data['formData']['hwTime']; ?>"/>
<input type="number" step="0.01" id="hwHeight" name="hwHeight[]" class="form-control <?php echo (!empty($data['formData']['hwHeight_error'])) ? 'is-invalid' : ''; ?>" value="<?php echo $data['formData']['hwHeight']; ?>"/>
<span class="invalid-feedback"><?php echo $data['formData']['hwTime_error']; ?></span>
<span class="invalid-feedback"><?php echo $data['formData']['hwHeight_error']; ?></span>
</div>
</div>
<div class="col-md-5 col-lg-4 tideLW">
<label for="lwTime">LW Time & Height</label>
<div class="input-group ">
<input type="time" id="lwTime" name="lwTime" class="form-control <?php echo (!empty($data['formData']['lwTime_error'])) ? 'is-invalid' : ''; ?>" value="<?php echo $data['formData']['lwTime']; ?>"/>
<input type="number" step="0.01" id="lwHeight" name="lwHeight[]" class="form-control <?php echo (!empty($data['formData']['lwHeight_error'])) ? 'is-invalid' : ''; ?>" value="<?php echo $data['formData']['lwHeight']; ?>"/>
<div class="input-group-append">
<button class="btn btn-ym-success btn-add-tide" type="button"><i class="fas fa-plus text-white"></i></button>
</div>
<span class="invalid-feedback"><?php echo $data['formData']['lwTime_error']; ?></span>
<span class="invalid-feedback"><?php echo $data['formData']['lwHeight_error']; ?></span>
</div>
</div>
</div>
<script>
$(document).ready(function() {
var controlFormTides = $('#repeatingTides:first');
controlFormTides.find('.tideLW:not(:last) .btn-add-tide')
.removeClass('btn-add-tide btn-ym-success').addClass('btn-remove-tide')
.removeClass('btn-ym-success').addClass('btn-ym-danger')
.html('<i class="fas fa-minus text-white"></i>');
});
$(document).on('click', '.btn-add-tide', function(e)
{
e.preventDefault();
var controlFormTides = $('#repeatingTides:first'),
currentTideLW = $(this).parents('.tideLW:first'),
currentTidePort = $('.tidePort:first'),
currentTideHW = $('.tideHW:first'),
newTidePortEntry = $(currentTidePort.clone()).appendTo(controlFormTides);
newTideHWEntry = $(currentTideHW.clone()).appendTo(controlFormTides);
newTideLWEntry = $(currentTideLW.clone()).appendTo(controlFormTides);
controlFormTides.find('.tideLW:not(:last) .btn-add-tide')
.removeClass('btn-add-tide btn-ym-success').addClass('btn-remove-tide')
.removeClass('btn-ym-success').addClass('btn-ym-danger')
.html('<i class="fas fa-minus text-white"></i>');
}).on('click', '.btn-remove-tide', function(e)
{
e.preventDefault();
$('.tideHW:first').remove();
$('.tidePort:first').remove();
$(this).parents('.tideLW:first').remove();
return false;
});
</script>
</div>
</div>
In your current you were adding all divs separately instead you can put all 3 divs i.e : tidePort ,tideHW..etc in some outer div and simply use .clone() to clone that entire div and make change to same cloned div . Then, append this cloned div using $("#repeatingTides").append(controlFormTides) .
Now, to remove the divs you can simply use $(this).parents('.outer').remove(); this will remove entire div which was added.
Demo Code :
$(document).on('click', '.btn-add-tide', function(e) {
e.preventDefault();
//get first div insde repeatingtildes
var controlFormTides = $('#repeatingTides .outer:first').clone(true);
$(controlFormTides).find('button.btn')
.removeClass('btn-add-tide btn-ym-success').addClass('btn-remove-tide btn-ym-danger')
.html('<i class="fa fa-minus"></i>');//add remove class
$("#repeatingTides").append(controlFormTides)
}).on('click', '.btn-remove-tide', function(e) {
e.preventDefault();
$(this).parents('.outer').remove();//remove closest class .outer
return false;
});
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<div class="row">
<div class="col-12">
<div id="repeatingTides">
<!--added this div-->
<div class="outer row">
<div class="col-md-2 col-lg-4 tidePort">
<div class="form-group ">
<label for="tidePort">Tide Port</label>
<input type="text" id="tidePort" name="tidePort[]" class="form-control <?php echo (!empty($data['formData']['tidePort_error'])) ? 'is-invalid' : ''; ?>" value="1" />
<span class="invalid-feedback"></span>
</div>
</div>
<div class="col-md-5 col-lg-4 tideHW">
<label for="hwTime">HW Time & Height</label>
<div class="input-group ">
<input type="time" id="hwTime" name="hwTime[]" class="form-control <?php echo (!empty($data['formData']['hwTime_error'])) ? 'is-invalid' : ''; ?>" value="<?php echo $data['formData']['hwTime']; ?>" />
<input type="number" step="0.01" id="hwHeight" name="hwHeight[]" class="form-control <?php echo (!empty($data['formData']['hwHeight_error'])) ? 'is-invalid' : ''; ?>" value="<?php echo $data['formData']['hwHeight']; ?>" />
<span class="invalid-feedback"><?php echo $data['formData']['hwTime_error']; ?></span>
<span class="invalid-feedback"><?php echo $data['formData']['hwHeight_error']; ?></span>
</div>
</div>
<div class="col-md-5 col-lg-4 tideLW">
<label for="lwTime">LW Time & Height</label>
<div class="input-group ">
<input type="time" id="lwTime" name="lwTime" class="form-control <?php echo (!empty($data['formData']['lwTime_error'])) ? 'is-invalid' : ''; ?>" value="<?php echo $data['formData']['lwTime']; ?>" />
<input type="number" step="0.01" id="lwHeight" name="lwHeight[]" class="form-control <?php echo (!empty($data['formData']['lwHeight_error'])) ? 'is-invalid' : ''; ?>" value="<?php echo $data['formData']['lwHeight']; ?>" />
<div class="input-group-append">
<button class="btn btn-ym-success btn-add-tide" type="button"><i class="fa fa-plus "></i></button>
</div>
<span class="invalid-feedback"><?php echo $data['formData']['lwTime_error']; ?></span>
<span class="invalid-feedback"><?php echo $data['formData']['lwHeight_error']; ?></span>
</div>
</div>
</div>
</div>
I have created Add / Remove fields to collect data such as Member Pic, Member name, Member Email, Member Role, and Member FB Id. Everything is working perfectly.
The only problem I am facing is that when I want to change the already saved image of a member with a new one, then it changes the first image only. Means If I try to change the second or third or next member's image it updates the first image only. This happens only with the pre-saved images only.
If I add a new member then it works perfectly.
Following is the code:
<div class="card">
<div class="card-header text-center">
<b>Team Members</b>
</div>
<div class="card-body">
<?php
$member_details = $wpdb->get_var( $wpdb->prepare( "SELECT member_details FROM {$wpdb->prefix}project_members WHERE author_id = %s AND project_id = %s", $current_user_id, $project_id ) );
$member_details_decode = json_decode( $member_details, true );
?>
<div class="row">
<div class="col-md-4">
<?php
if ( ! empty( $member_details_decode['member_images'][0] ) ) { ?>
<img src="<?php echo site_url( '/wp-content/img/member-images/' ); echo $member_details_decode['member_images'][0]; ?>" class="img-thumbnail" id="output_member0">
<?php } else { ?>
<img src="<?php echo site_url( '/wp-content/assets/img/blank-image.png' ); ?>" class="img-thumbnail" id="output_member0">
<?php }
?>
<br><br>
<label class="btn btn-success btn-block btn-file">Select Image<input type="file" name="member_image[]" onchange="preview_member(event, 0)" style="display: none;"></label>
</div>
<div class="col-md-8">
<div class="form-group">
<label for="member_name"><b>Member Name</b> <b style="color:#FF0000;">*</b></label>
<input type="text" class="form-control" name="member_name[]" value="<?php if ( $member_details_decode['member_names'][0] != '' ) echo esc_attr( $member_details_decode['member_names'][0] ); ?>">
</div>
<div class="form-group">
<label for="member_email"><b>Email Address</b> <b style="color:#FF0000;">*</b></label>
<input type="text" class="form-control" name="member_email[]" value="<?php if ( $member_details_decode['member_emails'][0] != '' ) echo esc_attr( $member_details_decode['member_emails'][0] ); ?>">
</div>
<div class="form-group">
<label for="member_role"><b>Role in Project</b> <b style="color:#FF0000;">*</b></label>
<input type="text" class="form-control" name="member_role[]" value="<?php if ( $member_details_decode['member_roles'][0] != '' ) echo esc_attr( $member_details_decode['member_roles'][0] ); ?>">
</div>
<div class="form-group">
<label for="member_fb"><b>Facebook Username</b> <b style="color:#FF0000;">*</b></label>
<input type="text" class="form-control" name="member_fb[]" value="<?php if ( $member_details_decode['member_fbs'][0] != '' ) echo esc_attr( $member_details_decode['member_fbs'][0] ); ?>">
</div>
</div>
</div>
<?php
$member_count = count( $member_details_decode['member_images'] );
for ( $i=1; $i < $member_count; $i++ ) { ?>
<div class="all-member-fields"><hr>
<div class="row">
<div class="col-md-4">
<?php
if ( ! empty( $member_details_decode['member_images'][$i] ) ) { ?>
<img src="<?php echo site_url( '/wp-content/img/member-images/' ); echo $member_details_decode['member_images'][$i]; ?>" class="img-thumbnail" id="output_member0">
<?php } else { ?>
<img src="<?php echo site_url( '/wp-content/assets/img/blank-image.png' ); ?>" class="img-thumbnail" id="output_member0">
<?php }
?>
<br><br>
<label class="btn btn-success btn-block btn-file">Select Image<input type="file" name="member_image[]" onchange="preview_member(event, 0)" style="display: none;"></label>
</div>
<div class="col-md-8">
<div class="form-group">
<label for="member_name"><b>Member Name</b> <b style="color:#FF0000;">*</b></label>
<input type="text" class="form-control" name="member_name[]" value="<?php if ( $member_details_decode['member_names'][$i] != '' ) echo esc_attr( $member_details_decode['member_names'][$i] ); ?>">
</div>
<div class="form-group">
<label for="member_email"><b>Email Address</b> <b style="color:#FF0000;">*</b></label>
<input type="text" class="form-control" name="member_email[]" value="<?php if ( $member_details_decode['member_emails'][$i] != '' ) echo esc_attr( $member_details_decode['member_emails'][$i] ); ?>">
</div>
<div class="form-group">
<label for="member_role"><b>Role in Project</b> <b style="color:#FF0000;">*</b></label>
<input type="text" class="form-control" name="member_role[]" value="<?php if ( $member_details_decode['member_roles'][$i] != '' ) echo esc_attr( $member_details_decode['member_roles'][$i] ); ?>">
</div>
<div class="form-group">
<label for="member_fb"><b>Facebook Username</b> <b style="color:#FF0000;">*</b></label>
<input type="text" class="form-control" name="member_fb[]" value="<?php if ( $member_details_decode['member_fbs'][$i] != '' ) echo esc_attr( $member_details_decode['member_fbs'][$i] ); ?>">
</div>
</div>
</div>
<button type="button" class="btn btn-danger" id="remove-member-fields" style="float: right;">Remove Member</button><br><br></div>
<?php }
?>
<div id="member-fields">
</div>
<button type="button" class="btn btn-success btn-block" id="add-member-fields">Add Member</button>
</div>
</div>
My Javascript Code:
<script type="text/javascript">
var i = 0;
function preview_member(event, inp) {
var reader = new FileReader();
console.log(inp);
reader.onload = function() {
var output = document.getElementById('output_member' + inp);
output.src = reader.result;
};
reader.readAsDataURL(event.target.files[0]);
}
jQuery(document).ready(function($) {
//fadeout selected item and remove
$(document).on("click", '#remove-member-fields', function(event) {
event.preventDefault();
$(this)
.parent()
.fadeOut(300, function() {
$(this).empty();
return false;
});
});
//add input
$('#add-member-fields').click(function() {
i++;
var rows = `<div class="all-member-fields"><hr><div class="row"><div class="col-md-4"><img src="<?php echo esc_url( site_url('/wp-content/assets/img/blank-image.png') ); ?>" class="img-thumbnail" id="output_member${i}"><br><br><label class="btn btn-success btn-block btn-file">Select Image<input type="file" name="member_image[]" onchange="preview_member(event, ${i})" style="display: none;"></label></div><div class="col-md-8"><div class="form-group"><label for="member_name"><b>Member Name</b> <b style="color:#FF0000;">*</b></label><input type="text" class="form-control" name="member_name[]"></div><div class="form-group"><label for="member_email"><b>Email Address</b> <b style="color:#FF0000;">*</b></label><input type="text" class="form-control" name="member_email[]"></div><div class="form-group"><label for="member_role"><b>Role in Project</b> <b style="color:#FF0000;">*</b></label><input type="text" class="form-control" name="member_role[]"></div><div class="form-group"><label for="member_fb"><b>Facebook Username</b> <b style="color:#FF0000;">*</b></label><input type="text" class="form-control" name="member_fb[]"></div></div></div><button type="button" class="btn btn-danger" id="remove-member-fields" style="float: right;">Remove Member</button><br><br></div>`;
$(rows)
.fadeIn("slow")
.appendTo('#member-fields');
return false;
});
});
</script>
You forgot to add your $i to preview_member() and to image id in your loop
Your preview_member() functions changes element with id output_member0 everytime.
In your for loop:
Change images ID from id="output_member0" to id="output_member<?= $i ?>" in your
Change onchange="preview_member(event, 0)" to onchange="preview_member(event, <?= $i ?>)"
New:
the changing the id and name works, but what if there are more inputs? the codepen only has one, but the real project would have several ie component_date, component_owner, how do I set these input unique as well?
I have this form that has a portion of it that replicates. The part that replicates has several inputs that need to be unique. Currently when replicated the name and id change, I would like to keep the existing name and
id and just add on a incremented number. Currently the inputs that are replicable change. so that initially, name="component_name" and id ="input-name when replicated the new inputs have name componentName_0 componentID_0. I want the initial input to have _0 and then each replicated one have the next increment. so component 2 would have name="component_1 id="input-name_1 and so on.
Essentially I want to use the original component id and name but just add an incremented number to each. in addition it would be nice to have the inital have a number(0?) already affixed to it. currently when replicated the name and id change from what they are initially
here is a simplified codepen to show what I mean:
https://codepen.io/anon_guy/pen/VMZWWW?editors=1010
HTML:
<div class="wrapper">
<div class="panel panel-default" id="add-components">
<div class="panel-heading">
<h3 class="panel-title"><i class="fa fa-pencil"></i> <?php echo $text_add_component; ?></h3>
</div>
<div class="panel-body" id="addon">
<div class="tab-content">
<div class="tab-pane active" id="tab-general">
<?php foreach ($languages as $language) { ?>
<div class="tab-pane" id="language<?php echo $language['language_id']; ?>">
<div class="form-group required">
<div class= "row">
<div class="col-sm-8 col-sm-push-1 form-group required" >
<label for="input-name<?php echo $language['language_id']; ?>"><?php echo $entry_name; ?></label>
<input type="text" name="component_name" placeholder="<?php echo $entry_name; ?>" id="input-name<?php echo $language['language_id']; ?>" class="form-control" value="<?php echo $component_name; ?>" />
<?php if (isset($error_name[$language['language_id']])) { ?>
<div class="text-danger"><?php echo $error_name[$language['language_id']]; ?></div>
<?php } ?>
</div>
<div class="col-sm-2 col-sm-push-1 form-group required">
<div class="campaign-group form-group">
<div class="dropdown">
<button class="btn btn-primary pull-left dropdown-toggle" type="button" id="button-type" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"><?php echo $text_filter_type;?><span class="caret"></span></button>
<ul class="campaign-form-type dropdown-menu">
<li class="campaign-dropdown-list">Direct Mail</li>
<li class="campaign-dropdown-list">Email</li>
<li class="campaign-dropdown-list">Event</li>
<li class="campaign-dropdown-list">Text Message</li>
<li class="campaign-dropdown-list">Letter</li>
<li class="campaign-dropdown-list">Postcard</li>
</ul>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-4 col-sm-push-1 form-group required">
<label class="control-label" for="input-date-beginning"><?php echo $entry_campaign_start_date; ?></label>
<div class="input-group date required">
<input type="text" name="component_date" placeholder="<?php echo $entry_date; ?>" data-date-format="YYYY-MM-DD" id="input-component_date" class="form-control" />
<span class="input-group-btn">
<button class="btn btn-default" type="button"><i class="fa fa-calendar"></i></button>
</span>
</div>
<?php if (isset($error_date_starting)) { ?>
<label class="text-danger"><?php echo $error_date_starting; ?></label>
<?php } ?>
</div>
<div class="col-sm-4 col-sm-push-1 form-group required">
<label class="control-label" ><?php echo $entry_owner; ?></label>
<select name="component_owner" id="component_owner">
<?php foreach ($users as $user) { ?>
<option value="<?php echo $user['username']; ?>"><?php echo $user['username']; ?></option>
<?php } ?>
</select>
</div>
<div class="col-sm-5 col-sm-push-1 form-group required">
<!--label class="control-label" for="input-code"><?php echo $entry_code; ?></label-->
<div class="input-code required">
<input type="text" name="campaign_code" value="<?php echo $code; ?>" placeholder="<?php echo $code; ?>" id="input-campaign_code" class="form-control" readonly />
</div>
<?php if (isset($error_date_starting)) { ?>
<label class="text-danger"><?php echo $error_code; ?></label>
<?php } ?>
</div>
</div>
</div>
</div>
</div>
</div>
<?php } ?>
</div>
</form>
</div>
</div>
JS:
<script type="text/javascript">
let cloneList = [];
var i = 0;
document.getElementById('launch').onclick = function(event) {
event.preventDefault();
var addOnDiv = document.getElementById('addon');
var container = document.getElementById('add-components')
var clonedNode = addOnDiv.cloneNode(true);
var component = clonedNode.querySelector('input');
clonedNode.id = i++;
cloneList.push(clonedNode.id);
component.id = `componentID_${clonedNode.id}`;
component.name = `componentName_${clonedNode.id}`;
container.appendChild(clonedNode);
}
</script>
It looks like you figured it out. appendChild was misspelled in your CodePen, I believe. As for the initial component having id 0, you could change the name and ID of the component to componentID_0 in your HTML, and then set var i = 1.
Use a loop on php, keep track of the counter, and concatenate the counter with the name or id.
E.g
for($i=0; $i<5; $i++){
echo '<div id="myID_"' . $i . 'andSoOn>'
}
I am using Laravel, I have a following data view
<div class="content-inside-main">
<div class="content-inside" id="content-inside-feedback">
<div class="row header-content space-div">
<div class="col-lg-1"><h5>#</h5></div>
<div class="col-lg-1"><h5>Member Id</h5></div>
<div class="col-lg-4"><h5>Question</h5></div>
<div class="col-lg-4"><h5>Reply</h5></div>
<div class="col-lg-1"><h5>Replied by</h5></div>
<div class="col-lg-1"><h5>Options</h5></div>
</div>
<div>
<hr class="line-div"/>
</div>
<?php
$questions= \App\Question::all();
?>
<?php
foreach ($questions as $question):
$id = $question->id;
$member_id = $question->user_id;
$body = $question->message;
$status=$question->replied;
$reply=$question->reply;
$user_id=$question->replied_id;
$member=\App\Member::find($member_id);
$m_id=$member->id;
$m_name=$member->nick_name;
$m_reg_time=$member->reg_time;
$m_unreg_time=$member->unreg_time;
$m_status=$member->unreg;
$m_group_id=$member->group;
$group=\App\Group::find($m_group_id);
$m_group_name=$group->name;
if($id != NULL) {
?>
<div class="row content-messages" >
<input type="hidden" id="count" value="{{$id}}"/>
<div class="col-lg-1"><?php echo $id; ?></div>
<div class="col-lg-1"><?php echo $member_id; ?></div>
<div class="col-lg-4"><?php echo $body; ?></div>
<div class="col-lg-4">
<?php
if($status == 0){
?>
<div class="according-form-container" id="reply-feedback-form_<?php echo $id; ?>">
<a class="btn-link show-add-form-div" data-toggle="collapse" data-parent="#reply-feedback-form_<?php echo $id; ?>" href="#reply-feedback-form_content_<?php echo $id; ?>" >
Reply
</a>
<div id="reply-feedback-form_content_<?php echo $id; ?>" class="collapse collapse-add-form">
<form class="form" id="reply-feedback_<?php echo $id; ?>" enctype="multipart/form-data" method="post" action="addreply">
{{csrf_field()}}
<div class="control-group">
<label class="control-label" for="description">Message: </label>
<div class="controls">
<input type="hidden" name="id" id="id" value="{{$id}}"/>
<input type="hidden" name="member_id" id="member_id" value="{{$member_id}}"/>
<input type="hidden" name="user_id" id="user_id" value="{{Auth::id()}}"/>
<textarea name="description" id="feedback-message_<?php echo $id; ?>" class="input-block-level" required></textarea>
<br/><br/>
<button id="submitfeedback_<?php echo $id . '_' . $member_id; ?>" type="submit" class="btn feedback-reply-submit-btn">Send</button>
</div>
</div>
</form>
<div id='preview_feedback_<?php echo $id; ?>'>
</div>
</div>
</div>
<?php
} else {?>
<div class="col-lg-4">{{$reply}}</div>
<?php
}
?>
</div>
<div class="col-lg-1">
<?php
if($user_id != null){
$user_name= DB::table('admin')->where('id',$user_id)->value('name');
echo $user_name;
}else {
echo 'None';
}
?>
</div>
<div class="col-lg-1">
<button id="view_member" name="view_member" class="btn btn-primary btn-sm" data-toggle="modal" data-target="#view_memeber"
>View
</button>
</div>
</div>
<hr class="line-div" />
<?php
}
endforeach;
?>
<div id="show"></div>
<div class="text-center navigation-paginator" id="paginator" >
</div>
</div>
I have another application.It fill question table anytime.I want to do If question table have new records,show them in this page without refreshing.
Like following screenshots:
before
after
You could send periodical ajax calls and then compare the results with the data you already have to add the new values. It could be something along this lines:
function query() {
$.ajax({
url: 'your/url',
success: function(data) {
var loadedValues = JSON.parse(data).values;
// Iterate only in the new values
for(i = existingValues.length; i < loadedValues.length; i++) {
$("#content-inside-feedback").append(/*HTML you want to add*/);
}
}
});
setTimeout(executeQuery, 5000);
}
$(document).ready(function() {
// First call, then it will be called periodically
setTimeout(query, 5000);
});