need help with drupal 7. I'm newbie with drupal.
I have code below for validation and validation errors, and it works fine. But errors always appear in wrong place.
I think the problem in $element, but i'm note sure.
some example html
<form id="webform_client_form_226">
<div class="catalogue__form-input-inner">
<div class="catalogue__form-input">
<div class="form-item">
// i need it here
<label for="edit-submitted-vashe-imya--3">Your name</label>
<input name="submitted[vashe_imya]" value="" size="60" maxlength="128" class="form-text error">
</div>
</div>
<div class="catalogue__form-input">
<div class="form-item webform-component webform-component-textfield webform-component--nomer-telefona webform-container-inline">
// and here
<label>Phone number</label>
<input name="submitted[nomer_telefona]">
</div>
</div>
<div class="catalogue__form-button">
// always appears here right now
<div class="form-actions">
<input name="op" value="send"></div>
</div>
</div>
</div>
and template.php
function pkpro_uikit_form_alter(&$form, &$form_state, $form_id) {
// Check the form id
if($form_id == 'webform_client_form_226') {
$form['#validate'][] = 'form_validate';
}
}
function form_validate(&$form, &$form_state) {
$message = "Field required";
if(isset($form_state['values']['submitted']['vashe_imya'])) {
$name = $form_state['values']['submitted']['vashe_imya'];
if( condition ) {
form_error($form['submitted']['vashe_imya'], $message);
}
}
if(isset($form_state['values']['submitted']['nomer_telefona'])) {
$name = $form_state['values']['submitted']['nomer_telefona'];
if( condition ) {
form_error($form['submitted']["nomer_telefona"], $message);
}
}
// get all validation errors.
$form_errors = form_get_errors();
if (!empty($form_errors)) {
foreach ($form_errors as $element => $error) {
$form[$element]['#suffix'] = '<div>'.$error.'</div>';
}
}
// clear default error messages.
drupal_get_messages('error');
}
Help, pls)
You need to modify your template. Look for page.tpl.php. It should have a $message variable on it. Move it to the correct location. If you only want it for one content type or page, copy the page.tpl.php so it only targets what you want.
Related
How can I avoid submitted state (and ng-submitted class & submitted scope property as true boolean) in a form when it is submitted?
Updated:
( function() {
angular
.module( 'app', [] )
.controller( 'SubmitController', SubmitController );
function SubmitController() {
var vm = this;
vm.submit = submit;
function submit( e ) {
console.log( 'Submit!' );
e.stopPropagation();
}
}
} )();
form,
[ng-form] {
padding: 1em;
border: 1px solid black;
}
.ng-submitted {
border: 1px solid red;
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>
<div ng-app="app">
<div ng-controller="SubmitController as vm">
<div ng-form>
<form novalidate ng-submit="vm.submit($event)">
<input type="text">
<button type="submit">Submit</button>
</form>
</div>
</div>
</div>
The main objective is that submit event was not fired and not arrived to parent element ([ng-form]).
Simple way to prevent the form to submit, add this type of logical condition with your Angular code:
<form name="formName" novalidate ng-submit="formName.$valid && ANY_LOGIC_CONDITION_LIKE_LOGIN.submit()">
This will help to prevent the form submission
See this.
Use formName.$valid to prevent submit form and add ng-model in your text box.
( function() {
angular.module( 'app', [] )
.controller( 'FormsController', FormsController );
function FormsController() {
var vm = this;
vm.submit = submit;
function submit( e ) {
console.log( 'Submit!' );
e.preventDefault();
e.stopPropagation();
}
}
} )();
[ng-form],
form {
padding: 10px;
border: 1px solid #000;
&.ng-submitted {
border: 1px solid #f00;
}
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app">
<div ng-controller="FormsController as vm">
<div ng-form>
<form name="test" novalidate name="test" ng-submit="test.$valid && vm.submit($event)">
<input type="text" ng-model="vm.test" required>
<button type="submit">Submit</button>
</form>
</div>
</div>
</div>
See #Taylor Buchanan's answer here, once you added the directive. you can simply call it form your JavaScript function.
What you have to do:
Add that directive to your code.
Add a name to your parent-form: ng-form="myForm".
pass your form to your submit function: `vm.submit(myForm)'.
And then modify your function:
function submit( form ) {
console.log( 'Submit!' );
form.$setUnsubmitted();
}
P.S. Since I wasn't sure which one of the forms you wanted to unSubmit, So I assumed you want both. But Obviously, you are getting full controll, so you can modify the code accordingly.
UPDATED
Seeing you code/behavior (after the update)...
Why must you submit the child form? What is the benefit? I'm seeing that you are using novalidate, so browser validation won't work.
Why you don't simply use a ng-click="vm.click(myForm)". You won't have any troubles with parent form, and angularjs won't add/set any $submitted state or ng-selected class, so you can handle this manually as you want passing a simple form instance.
PLUNKER DEMO
HTML
<div ng-form>
<form id="myForm" name="myForm" novalidate >
<label>My Input:</label>
<input type="text" name="myInput" ng-model="vm.item.myInput" required>
<button type="button" ng-click="vm.click(myForm)">Submit</button>
</form>
</div>
CONTROLLER/JS
app.controller('MainCtrl', function($scope) {
vm.click = function (myForm) {
alert('submitted');
//myForm.$valid
//call to server
}
});
If this way fits for your scenario, here you are an awnser... If not, I hope some of others solutions works for you :)
You can trigger $setPristine() method of FormController. You just need to pass the form itself as an arguement to your submit function and trigger its built in method.
e.g.
View:
<form name="MyForm" ng-submit="submitForm(MyForm)">
<button type="submit">Submit</button>
</form>
Controller:
$scope.submitForm = (form) => {
form.$setPristine();
alert("Form was submitted")
}
Here's a working example of the above code snippet.
Update
It doesn't matter if you have nested forms. Propagation doesn't work like you think it does. You should also give your ng-form a name. Then pass it down to the submit function and call its built in $setPristine() method once more.
Check this code chunk:
View:
<div ng-form name="outterForm">
<form name="myForm" ng-submit="vm.submit($event,myForm, outterForm)">
<button type="submit">Submit</button>
</form>
</div>
Controller:
function submit( e, form1, form2 ) {
console.log( 'Submit!' );
e.stopPropagation();
form1.$setPristine();
form2.$setPristine();
}
Here's an the updated example based on your code chunk demonstrating the nested forms case.
I'm using Advanced Custom Fields on my WordPress site and I have a datepicker start-date & end-date that I'm trying to set min/max on when one is selected. From jQuery's datepicker date-range I'm trying to add the onClose option.
I currently have the following code based off the custom javascript fields page but it's not working.
<?php function takeover_scripts() { ?>
<script type="text/javascript">
(function($) {
var startDate = $('.acf-field-568d4b2968a3e');
acf.add_filter('date_picker_args', function( args, startDate ){
// do something to args
args.changeMonth = false;
args.onClose = function( selectedDate ) {
$( ".acf-field-568d4bbd68a3f" ).datepicker( "option", "minDate", selectedDate );
}
// return
return args;
});
var endDate = $('.acf-field-568d4bbd68a3f');
acf.add_filter('date_picker_args', function( args, endDate ){
// do something to args
args.changeMonth = true;
args.onClose = function( selectedDate ) {
$( ".acf-field-568d4b2968a3e" ).datepicker( "option", "minDate", selectedDate );
}
// return
return args;
});
})(jQuery);
</script>
<?php }
add_action('acf/input/admin_footer', 'takeover_scripts'); ?>
I'm not sure if I need to target the id of the end-date input or the field number or if I even have the start-date field selected correctly. If anyone has any experience with this please let me know what I'm setting/selecting wrong.
Here's the markup for the two fields :
<div class="acf-field acf-field-date-picker acf-field-568d4b2968a3e" style="width:25%;" data-name="start_date" data-type="date_picker" data-key="field_568d4b2968a3e" data-required="1" data-width="25">
<div class="acf-label">
<label for="acf-field_568d479e68a3b-0-field_568d4b2968a3e">Start Date <span class="acf-required">*</span></label>
</div>
<div class="acf-input">
<div class="acf-date_picker acf-input-wrap" data-display_format="MM d, yy" data-first_day="0">
<input id="acf-field_568d479e68a3b-0-field_568d4b2968a3e" class="input-alt" type="hidden" name="acf[field_568d479e68a3b][0][field_568d4b2968a3e]" value="">
<input type="text" value="" class="input active hasDatepicker" id="dp1452127570218">
</div>
</div>
</div>
<div class="acf-field acf-field-date-picker acf-field-568d4bbd68a3f" style="width:25%;" data-name="end_date" data-type="date_picker" data-key="field_568d4bbd68a3f" data-required="1" data-width="25">
<div class="acf-label">
<label for="acf-field_568d479e68a3b-0-field_568d4bbd68a3f">End Date <span class="acf-required">*</span></label>
</div>
<div class="acf-input">
<div class="acf-date_picker acf-input-wrap" data-display_format="MM d, yy" data-first_day="0"><input id="acf-field_568d479e68a3b-0-field_568d4bbd68a3f" class="input-alt" type="hidden" name="acf[field_568d479e68a3b][0][field_568d4bbd68a3f]" value=""><input type="text" value="" class="input active hasDatepicker" id="dp1452127570219"></div>
</div>
</div>
Thanks
P.S. : I also have this on ACF's support located here.
A little late to this, but I finally figured it out.
So it turns out the .datepicker() function needs to be called on the input field with the class .hasDatepicker and not the input field with the acf id.
I have the following working:
$('.acf-field-568d4b2968a3e').find('.hasDatepicker').datepicker('option', 'minDate', minDateVar );
Hope this helps someone!
I am new with Wordpress.
I have created a simple plugin to save setting for theme.
In this its working fine for saving data in database.
But am having problem when i am exporting my project Databse and import to new database.
That time all settings are gone ,i have to update theme setting every time when i am importing database to new database.
Any suggestion.
What am i doing wrong.
// admin page
function my_custom_settings_form()
{
include('include/settings.php');
}
// admin menu
function my_custom_settings_menu()
{
add_options_page('CustomSetting', ' Theme Settings', 'manage_options', 'theme-settings', 'my_custom_settings_form');
}
add_action('admin_menu', 'my_custom_settings_menu');
// register setting
function my_custom_settings_settings()
{
register_setting('wp_sp_settings_group', 'pageSettings');
}
add_action('admin_init', 'my_custom_settings_settings');
function do_css()
{
wp_enqueue_style('thickbox');
wp_enqueue_style('thickbox');
}
function do_jslibs()
{
wp_enqueue_script('editor');
wp_enqueue_script('thickbox');
add_action( 'admin_head', 'wp_tiny_mce' );
}
add_action('admin_print_scripts', 'do_jslibs' );
add_action('admin_print_styles', 'do_css' );
function wp_gear_manager_admin_scripts() {
wp_enqueue_media();
}
function wp_gear_manager_admin_styles() {
wp_enqueue_style('thickbox');
}
add_action('admin_print_scripts', 'wp_gear_manager_admin_scripts');
add_action('admin_print_styles', 'wp_gear_manager_admin_styles');
?>
include/settings.php
$pageSettings = get_option('pageSettings');
?>
<div class="wrap">
<h2>Theme Settings</h2>
<hr/>
<?php settings_errors('', true, true); ?>
<div class="postbox-container" id="poststuff">
<form action="options.php" method="POST">
<?php settings_fields('wp_sp_settings_group'); ?>
<div class="postbox">
<div class="handlediv" title="Click to toggle">
<br>
</div>
<h3>
<span>Header Logo</span>
</h3>
<div class="inside">
<table class="form-table ">
<tbody>
<tr>
<td>
<div class="uploader">
<input type="text" name="pageSettings[site-logo]" id="site-logo" value="<?php echo $pageSettings['site-logo'] ; ?>" />
<input class="button" type="button" name="site-logo-button" id="site-logo-button" value="Upload" />
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<p class="submit">
<input type="submit" value="Save Changes" class="button button-primary" id="submit"
name="submit">
</p>
</form>
</div>
</div>
The Best way to Make a exact copy of database without losing any info is by going to the database itself and export everything. Then import the data into the new website setup your WP config. Once done, go into the database and change your wp-setting data table for values
related to WEBSITE URL
There should be two places you need to change.
Jay has the right answer, but I think off the top of my head the table is wp_options rather than settings. The things you need to change are "siteurl" and "home"
I have updated meteor application to version 0.8.0 from 0.7.0.1. Every changes tried to do but not able to figure out, how to change triple tag according to new version. Referred the following link and tried to do so but still getting error.
The link following is: https://github.com/meteor/meteor/wiki/Using-Blaze
The code of .html file is: Basically this {{{done }}} part. I tried to change according to the above link as {{> done}}. But then getting error as ""Reactive HTML attributes must either have a constant name or consist of a single {{helper}} providing a dictionary of names and values. A template tag of type INCLUSION is not allowed here.
""
<template name="subscribedKeyword">
<div class="issue" >
<div class="issue-content">
<h3>
{{category}}
<input id='check' class="checktype" name="mark" type="checkbox" value="1" {{{ done}}} />Get Notifications
<input type="hidden" name="mark" value="0" />
</h3>
</div>
</div>
</template>
The corresponding .js file code is: I think that there is no need to change anything in this file. As according to the above link, changes need to be done in the html file only.
Template.subscribedKeyword.done = function () {
// alert('inside done function');
var subscribedUsersOfThisDomain= Subscribed.findOne(this._id);
var subscribedPersons = subscribedUsersOfThisDomain.categorySubscribedUsers;
// alert('before if block in done function');
if(subscribedPersons && subscribedPersons.length)
{
var j;
var ch='';
// alert('before loop in done function');
for(j= 0;j< subscribedPersons.length;j++)
{
//alert('j '+j);
//alert('person '+person[j].username);
if(subscribedPersons[j].username === Meteor.user().username)
{
ch ="checked";
// alert('value of ch that is set'+ch);
break;
}
}
if(ch=== 'checked')
{
// alert('while returning value in if block');
return 'checked="checked"';
}
else
{
// alert('while returning value in else block');
return '';
}
}
else
return '';
};
Do let me know what changed need to be done. Thanks in advance
The simplest way I can see is:
<template name="subscribedKeyword">
<div class="issue" >
<div class="issue-content">
<h3>
{{category}}
<input id='check' class="checktype" name="mark" type="checkbox" value="1" checked={{done}} />Get Notifications
<input type="hidden" name="mark" value="0" />
</h3>
</div>
</div>
</template>
Template.subscribedKeyword.done = function () {
// alert('inside done function');
var subscribedUsersOfThisDomain= Subscribed.findOne(this._id);
var subscribedPersons = subscribedUsersOfThisDomain.categorySubscribedUsers;
// alert('before if block in done function');
if(subscribedPersons && subscribedPersons.length)
{
var j;
var ch='';
// alert('before loop in done function');
for(j= 0;j< subscribedPersons.length;j++)
{
//alert('j '+j);
//alert('person '+person[j].username);
if(subscribedPersons[j].username === Meteor.user().username)
{
ch ="checked";
// alert('value of ch that is set'+ch);
break;
}
}
if(ch=== 'checked')
{
// alert('while returning value in if block');
return "checked";
}
else
{
// alert('while returning value in else block');
return null;
}
}
else
return null;
};
According to https://github.com/meteor/meteor/wiki/Using-Blaze#conditional-attributes-with-no-value-eg-checked-selected
I have two files the one which hosts my actual contact form and then a file where i post the form to.
contactform.php (which is part of the footer template)
<form id="contact" action="<?php bloginfo('template_url'); ?>/sendmail.php" method="post">
<label for="name">Your name: *</label>
<input type="text" id="nameinput" name="name" value=""/>
<label for="email">Your email: *</label>
<input type="text" id="emailinput" name="email" value=""/>
<label for="comment">Your message: *</label>
<textarea cols="20" rows="7" id="commentinput" name="comment"> </textarea><br />
</form>
sendmail.php
<?PHP
if(isset($_POST['submit'])) {
error_reporting(E_NOTICE);
function valid_email($str)
{
return ( ! preg_match("/^([a-z0-9\+_\-]+)(\.[a-z0-9\+_\-]+)*#([a-z0-9\-]+\.)+[a-z]{2,6}$/ix", $str)) ? FALSE : TRUE;
}
if($_POST['name']!='' && $_POST['email']!='' && valid_email($_POST['email'])==TRUE && strlen($_POST['comment'])>1)
{
$to = preg_replace("([\r\n])", "", hexstr($_POST['receiver']));
$from = preg_replace("([\r\n])", "", $_POST['email']);
$subject = "Website contact message from ".$_POST['name'];
$message = $_POST['comment'];
$match = "/(bcc:|cc:|content\-type:)/i";
if (preg_match($match, $to) ||
preg_match($match, $from) ||
preg_match($match, $message)) {
die("Header injection detected.");
}
$headers = "From: ".$from."\r\n";
$headers .= "Reply-to: ".$from."\r\n";
if(wp_mail($to, $subject, $message, $headers,'',true))
{
echo 1; //SUCCESS
}
else {
echo 2; //FAILURE - server failure
}
}
else {
echo 3; //FAILURE - not valid email
}
}else{
die("Direct access not allowed!");
}
function hexstr($hexstr) {
$hexstr = str_replace(' ', '', $hexstr);
$hexstr = str_replace('\x', '', $hexstr);
$retstr = pack('H*', $hexstr);
return $retstr;
}
?>
The issue is that this does not know of wp_mail function. I know that I need to include something so wp_mail will be available but what do I add? The function does exist. The issue with including the file that has wp_mail defined is that inside that function it requires some core php functions (wp_mail is being overwritten by cimy_swift plugin)
hi why not try just submitting the form to the base wpurl? then within your header.php file copy and paste your code in?
ie: using a hidden field you can check to see if its been posts, in this case the hidden field is called 'action' and it has a value of 'sendemail'.
form
<form id="contact" action="<?php bloginfo('wpurl'); ?>" method="post">
//form stuff
<input type="hidden" name="action" value="sendemail" />
</form>
Header.php
within the header file we do a call to check and see if the form has been posted,
<html>
<head>
<title><?php wp_title();?></title>
<?php
if( isset($_POST['action']) && ($_POST['action']=='sendemail') ) {
// run your code
}
?>
</head>
if you dont want to go down that route, and wish to use your theme folder to hold the php script then what to is, include the below in your sendmail.php file
define('WP_USE_THEMES', FALSE);
require('../../../wp-blog-header.php');
//above is assuming your file is located in the theme root, not a sub folder.
this will give you access to all the wordpress functions and shortcodes etc..etc..
hope that helps a little..
Marty