I have installed the PayPal module and added all of the API details. It appears on the page, however it cannot be clicked. Why could this be? The code, as viewed in the source, is this:
It looks a bit odd to me. Like the image should be linked to the form somehow?
Also tried it in sandbox mode and that doesn't work either.
<div id="HOOK_SHOPPING_CART_EXTRA">
<div id="container_express_checkout" style="float:right; margin: 10px 40px 0 0">
<img id="payment_paypal_express_checkout" src="https://www.paypal.com/en_US/i/btn/btn_xpressCheckout.gif" alt="" />
<form id="paypal_payment_form" action="http://mydomain.com/store/modules/paypal/express_checkout/payment.php" data-ajax="false" title="Pay with PayPal" method="post" data-ajax="false">
<!-- Change dynamicaly when the form is submitted -->
<input type="hidden" name="quantity" value="1" />
<input type="hidden" name="id_p_attr" value="" />
<input type="hidden" name="express_checkout" value="cart"/>
<input type="hidden" name="current_shop_url" value="http://mydomain.com/store/index.php?controller=order&multi-shipping=0" />
<input type="hidden" name="bn" value="FR_PRESTASHOP_H3S" />
</form>
</div>
</div>
Fixed it myself. The required code that makes the button work was missing the header. If anyone else finds this page in the future, the code you need is:
$(document).ready( function() {
$('#payment_paypal_express_checkout').click(function() {
$('#paypal_payment_form').submit();
return false;
});
$('#paypal_payment_form').live('submit', function() {
var nb = $('#quantity_wanted').val();
var id = $('#idCombination').val();
$('#paypal_payment_form input[name=quantity]').val(nb);
$('#paypal_payment_form input[name=id_p_attr]').val(id);
});
function displayExpressCheckoutShortcut() {
var id_product = $('input[name="id_product"]').val();
var id_product_attribute = $('input[name="id_product_attribute"]').val();
$.ajax({
type: "GET",
url: baseDir+'/modules/paypal/express_checkout/ajax.php',
data: { get_qty: "1", id_product: id_product, id_product_attribute: id_product_attribute },
cache: false,
success: function(result) {
if (result >= '1')
$('#container_express_checkout').slideDown();
else
$('#container_express_checkout').slideUp();
return true;
}
});
}
$('select[name^="group_"]').change(function () {
displayExpressCheckoutShortcut();
});
$('.color_pick').click(function () {
displayExpressCheckoutShortcut();
});
var modulePath = 'modules/paypal';
var subFolder = '/integral_evolution';
var fullPath = baseDir + modulePath + subFolder;
var confirmTimer = false;
if ($('form[target="hss_iframe"]').length == 0) {
if ($('select[name^="group_"]').length > 0)
displayExpressCheckoutShortcut();
return false;
} else {
checkOrder();
}
function checkOrder() {
confirmTimer = setInterval(getOrdersCount, 1000);
}
function getOrdersCount() {
$.get(
fullPath + '/confirm.php',
{ id_cart: '7' },
function (data) {
if ((typeof(data) != 'undefined') && (data > 0)) {
clearInterval(confirmTimer);
window.location.replace(fullPath + '/submit.php?id_cart=7');
$('p.payment_module, p.cart_navigation').hide();
}
}
);
}
});
Related
This is controller.php
<?php
class Autocomplete extends CI_Controller
{
public function __construct()
{
parent::__construct();
$this->load->model('datacomplete');
}
public function index($id)
{
echo $id;
$this->load->view('view_demo', $data);
}
public function GetCountryName()
{
$keyword = $this->input->post('keyword');
$data = $this->datacomplete->GetRow($keyword);
echo json_encode($data);
}
}
?>
This is a model
<?php
class Datacomplete extends CI_Model
{
public function GetRow($keyword)
{
$this->db->order_by('id', 'DESC');
$this->db->like("name", $keyword);
return $this->db->get('autocomplete')->result_array();
}
}
this is view.php
<!DOCTYPE html>
<html>
<head>
<!-- Latest compiled and minified CSS -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
<!-- Latest compiled and minified JavaScript -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
</script>
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js">
</script>
<script src="<?php echo base_url(); ?>assets/custom.js">
</script>
</link>
</head>
<body style="background-color: #000000;">
<?php echo $id= 1; ?>
<form action="<?php echo base_url('autocomplete/index/' .$id); ?>" method="post">
<div class="row">
<center>
<h2 style="color: #fff;">
AUTOCOMPLETE FORM FROM DATABASE USING CODEIGNITER AND AJAX
</h2>
</center>
<div class="col-md-4 col-md-offset-4" style="margin-top: 200px;">
<label class="control-lable" style="color: #fff;">
Country Name
</label>
<input autocomplete="off" class="form-control" id="country" name="country" placeholder="Type to get an Ajax call of Countries" style="height:70px" type="text">
<ul aria-labelledby="dropdownMenu" class="dropdown-menu txtcountry" id="DropdownCountry" role="menu" style="margin-left:15px;margin-right:0px;">
</ul>
<input type="submit">
</input>
</input>
</div>
</div>
</form>
</body>
</html>
This is custom.js file
$(document).ready(function() {
$("#country").keyup(function() {
$.ajax({
type: "POST",
url: "http://localhost/codeajax/autocomplete/GetCountryName",
data: {
keyword: $("#country").val()
},
dataType: "json",
success: function(data) {
if (data.length > 0) {
$('#DropdownCountry').empty();
$('#country').attr("data-toggle", "dropdown");
$('#DropdownCountry').dropdown('toggle');
} else if (data.length == 0) {
$('#country').attr("data-toggle", "");
}
$.each(data, function(key, value) {
if (data.length >= 0)
$('#DropdownCountry').append('<li role="displayCountries" ><a role="menuitem dropdownCountryli" class="dropdownlivalue">' + value['name'] + '</a></li>');
});
}
});
});
$('ul.txtcountry').on('click', 'li a', function() {
$('#country').val($(this).text());
});
});
I want to fetch the id of the country dynamically in the URL after clicking the submit button.
Now I have this using static passing id as 1.
the table has two column id and name of the country.
how to pass the id dynamically to url when I click the submit button.
I m failing to fetch the id dynamically from database ie when I click on submit should redirect to the new page with country id or echo $id in the new page as well as to the URL it should show me id of the country
You could achieve it using javascript.
First change the form :
<form action="<?php echo base_url('autocomplete/index/' .$id); ?>" method="post">
To :
<form method="post" id="countryForm">
Then change the submit button :
<input type="submit">
To :
<input type="submit" id="submitForm" disabled>
And then apply the following javascript codes :
$(document).ready(function() {
$("#country").keyup(function() {
$.ajax({
type: "POST",
url: "http://localhost/codeajax/autocomplete/GetCountryName",
data: {
keyword: $("#country").val()
},
dataType: "json",
success: function(data) {
if (data.length > 0) {
$('#DropdownCountry').empty();
$('#country').attr("data-toggle", "dropdown");
$('#DropdownCountry').dropdown('toggle');
} else if (data.length == 0) {
$('#country').attr("data-toggle", "");
}
// Assign each country id into each country list `data-` element
$.each(data, function(key, value) {
if (data.length >= 0)
$('#DropdownCountry').append('<li role="displayCountries" ><a role="menuitem dropdownCountryli" data-countryid="' + value['id'] + '" class="dropdownlivalue">' + value['name'] + '</a></li>');
});
}
});
});
$('ul.txtcountry').on('click', 'li a', function() {
$('#country').val($(this).text());
$('#countryForm').attr('action', '<?php echo base_url('autocomplete/index/'); ?>' + $(this).data('countryid'); // set new form action which contain country id
$('#submitForm').removeAttr('disabled'); // enable the submit button after one country is selected
});
});
I am storing the unicode values in java script array but when I pass it to the ci controller it is not showing in proper language.
How to pass javascript unicode array to php using form post?
My code is:-
var myTableArray = [];
$("table#search_result_table tr").each(function() {
var arrayOfThisRow = [];
var tableData = $(this).find('td');
if (tableData.length > 0) {
tableData.each(function() { arrayOfThisRow.push($(this).text()); });
myTableArray.push(arrayOfThisRow);
}
});
var myJSON = JSON.stringify(myTableArray);
$.post("<?php echo base_url("Purchase/addnew"); ?>",{data:
myJSON},$("#purform").serialize(),function(data)
Santosh, to post Unicode Array through AJAX and JSON, you need 3 files i.e. Javascript file, html file and a php file. Below is the samle code,
JS file
// make the AJAX request
// #dataform : it is a html data form id
var dataString = $('#dataform').serialize();
$.ajax({
type: "POST",
url: 'php_file.php',
data: dataString,
dataType: 'json',
success: function (data) {
if (data.success == 0) {
var errors = '';
if (data.err_msg != '')
alert('Error');
}
else if (data.success == 1) {
alert('Success');
}
},
error: function (x,e) {
alert('Error: '+x.status+','+x.responseText);
}
});
HTML file
<form id="dataform" name="dataform" method="post" action="" role="form">
<input type="text" name="field1" id="field1" />
<input type="text" name="field2" id="field2" />
<input type="text" name="field3" id="field3" />
<input type="text" name="field4" id="field4" />
<button type="button" name="submit" id="submit" onclick="return false;">Submit</button>
</form>
PHP file
$field1=$_REQUEST["field1"];
$field2=$_REQUEST["field2"];
$field3=$_REQUEST["field3"];
$field4=$_REQUEST["field4"];
//Your Validation Logic
$return_array = validate($field1);
if($return_array['success'] == '1') {
//Your SQL Query //
}
function validate($field1)
{
$return_array = array();
$return_array['success'] = '1';
$return_array['err_msg'] = '';
//Validate Field Logic
if($field1=='')
{
$return_array['success'] = '0';
$return_array['err_msg'] = 'Field1 is required!';
}
return $return_array;
}
header('Content-type: text/json');
echo json_encode($return_array);
die();
I was changing my loginpage and I've put the jquery with the form-validation in a separate file instead of on the page itself.
$(document).ready(function(){
$("#confirm").on("click", function(e){
e.PreventDefault();
var check = true;
var empty_fields = ['name','password'];
for (i=0; i<empty_fields.length; i++) {
var $field = $('#'+empty_fields[i]);
if ($.trim($field.val()) == '') {
$field.addClass('error');
check = false;
}
else {
$field.removeClass('error');
}
}
if (check == true)
{
$.ajax({
type: 'POST',
url: 'PHPCalls.php?CallID=Login',
data: $("#loginform").serialize(),
success: function(data) {
var result = $.trim(data);
if(result == 'true') {
alert('succeeded');
}
}
});
}
});
});
Before the part where I do my check on the input being empty was on the login-page itself and worked fine. I called it with an onclick="return check_form();" and then returned the value 'check' being true or false.
Since I've put this script in a separate file it seems like the page is reloading itself. When I click on the confirm-button the input-boxes get the error-layout but then the page flashes and all is set back to normal...I have no clue what is happening...
Anyone can set me on the right track?
This is a stripped part of the login-page
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="js/ajaxLogin.js"></script>
<script type="text/javascript" src="js/sha512.js"></script>
<script type="text/javascript" src="js/forms.js"></script>
</head>
<body>
<form name="loginform" class="loginform" action="#" method="post">
<input type="text" name="name" id="name" class="input username" placeholder="Name" onfocus="this.value=''" />
<input type="password" name="password" id="password" class="input password" placeholder="Wachtwoord" onfocus="this.value=''" />
<input type="submit" id="confirm" value="Login" class="button" />
</form>
</body>
SOLUTION: add PreventDefault() and remove formhash()
You need to return false if check! = true
if (check == true)
{
$.ajax({
type: 'POST',
url: 'PHPCalls.php?CallID=Login',
data: $("#loginform").serialize(),
success: function(data) {
var result = $.trim(data);
if(result == 'true') {
alert('succeeded');
}
}
});
}
else
{
return false;
}
Try this
I have the following script. It works in jsFiddle
The problem is when I fill in the title AND the text box I have to submit TWICE.
Does someone have an idea of what I'm doing wrong?!
form:
<form id="formid" class="form" method="POST" action="/">
<div>
<label class="title">Title</label>
<div id="titleError"></div>
<input type="text" id="title" name="title" value="">
</div>
<div>
<label class="title">Text</label>
<div id="textError"></div>
<textarea name="text" id="text" rows="14" cols="50"></textarea><br />
</div>
<div>
<input class="btn btn-success" type="submit" id="submitButton" name="submitButton" value="Submit">
</div>
JS:
<script type='text/javascript'>
$(document).ready(function() {
$("#formid").submit( function(event) {
tinyMCE.triggerSave();
var title = $('#title').val();
var text = $('#text').val();
if( title.length === 0 || text.length === 0 ){
if( title.length === 0 ){
$("#titleError").html("<p>Title verplicht</p>");
event.preventDefault();
}
if( text.length === 0 ){
$("#textError").html("<p>Text verplicht</p>");
event.preventDefault();
}
$("html, body").animate({ scrollTop: 0 }, 600);
}
else{
tinyMCE.triggerSave();
/* stop form from submitting normally */
event.preventDefault();
/* Send the data using post */
var posting = $.post( 'http://domain.nl/admin/pages/create', {
title: $('#title').val(),
text: $('#text').val()
});
/* Put the results in the show-content div */
posting.done(function( data ) {
//alert(data);
$.ajax({
url: "<?php echo base_url() ?>/admin/pages",
type: 'GET',
success: function(data) {
$("#show-content").hide().html( data).fadeIn(1500);
}
,
error: function() {
alert("error");
}
});
});
}
});
});
</script>
The solution:
I add this
tinyMCE.triggerSave();
after
$("#formid").submit( function(event) {
and now it works correctly!
I have two forms on my website, and I use jQuery to submit them, to my PHP script.
These are the forms:
<form method="post" class="settings-form" id="passwordSettings">
<label id="npasswordbox" class="infoLabel">New Password: </label>
<input type="password" name="npassword" size="50" value="" >
<div class="move"></div>
<label id="cnpasswordbox" class="infoLabel">Confirm: </label>
<input type="password" name="cnpassword" size="50" value="" >
<button class="btn" name="passwordSetings" style="margin-left:185px" type="submit">Save </button>
</form><!-- end form -->
And the next:
<form method="post" class="settings-form" id="normalSettings">
<label id="npasswordbox" class="infoLabel">New Username: </label>
<input type="text" name="username" size="50" value="" >
<div class="move"></div>
<button class="btn" name="normalSettings" style="margin-left:185px" type="submit">Save </button>
</form><!-- end form -->
Here is the jQuery I have written for these two forms:
$(function() {
$('form#passwordSettings').submit(function(){
$('#status').hide();
$.post(
'index.php?i=a&p=s',
$('form#passwordSettings').serialize(),
function (data) {
proccessPWData(data);
}
);
return false;
});
});
function proccessPWData (data) {
$('#status').hide().html('');
if(data=='success'){
$('form#normalSettings').fadeOut();
$('html, body').animate({scrollTop:0});
$("#status").removeClass();
$('#status').addClass('alert alert-success').html('You have successfully changed your personal settings.<br />').slideDown().delay(5000);
redirect("/account");
}
else {
$('html, body').animate({scrollTop:0});
$('#status').removeClass().addClass('alert alert-error').html(data).fadeIn();
setTimeout(function(){
$('#status').slideUp("slow");
},7000);
}
}
$(function() {
$('form#normalSettings').submit(function(){
$('#status').hide();
$.post(
'index.php?i=a&p=s',
$('form#normalSettings').serialize(),
function (data) {
proccessData(data);
}
);
return false;
});
});
function proccessData (data) {
$('#status').hide().html('');
if(data=='success'){
$('form#normalSettings').fadeOut();
$('html, body').animate({scrollTop:0});
$("#status").removeClass();
$('#status').addClass('alert alert-success').html('You have successfully changed your personal settings.<br />').slideDown().delay(5000);
redirect("/account");
}
else {
$('html, body').animate({scrollTop:0});
$('#status').removeClass().addClass('alert alert-error').html(data).fadeIn();
setTimeout(function(){
$('#status').slideUp("slow");
},7000);
}
}
And then the PHP code:
if(isset($_POST['normalSettings']))
{
$username = inputFilter($_POST['username']);
if(!$username){
$error ="no username";
}
if(!$error){
echo "success!";
}
}
if(isset($_POST['passwordSettings']))
{
$password = inputFilter($_POST['npassword']);
if(!$username){
$error ="no pw";
}
if(!$error){
echo "success!";
}
}
My problem is, that whenever I submit one of these forms, I see the form with my $error in the #status div.
How can I have multiply forms on one page, but submit the correct ones?
$(function() {
$('form#passwordSettings').submit(function(e){
e.preventDefault(); // prevents the default action (in this case, submitting the form)
$('#status').hide();
$.post(
'index.php?i=a&p=s',
$('form#passwordSettings').serialize(),
function (data) {
proccessPWData(data);
}
);
return false;
});
});
or you could just give an hidden input-field with it
<input type="hidden" name="_normalSettings">
and check in your PHP
if (isset($_POST['_normalSettings']) // ...
This is basically just answer to your question: "How can I have multiple forms on one page, but submit the correct ones?"
I have many dynamically generated forms on a single page and I send them to process file one by one. This is one form simplified:
<form name="form" id="form">
<!--form fields
hidden field could be used to trigger wanted process in the process file
-->
<input type="hidden" name="secret_process_id" value="1" />
<a class="button_ajax">Send form</a>
</form>
<div id="process_msg<?php echo $id; ?>"></div>
And here's the form submit function:
$(document).ready(function() {
$('.submit_ajax').click(function() { //serializes the parent form
//alert($(this).serialize());
dataString = $(this).parent().serialize();
//if you want to echo some message right below the processed form
var id = /id=\d+/.exec(dataString);
var id = /\d+/.exec(id);
$.ajax({
type: 'post',
url: '_process.php?ajax=1', //some or none parameters
data: dataString,
dataType: 'html',
success: function(data) {
$('#process_msg' + id).fadeIn(400);
$('#process_msg' + id).html(data);
}
}); //end of $.ajax
return false;
});
});
All you need is a process file/function and you are ready to go. Works just fine with one or dozens of forms. There you can do something like this:
if ($_POST['secret_process_id']==1){
//do something
}
if ($_POST['secret_process_id']==2){
//do something else
}
//etc.