i'm new in codeigniter programming and i'm having some problems with a link to another controller.
i've got an Homepage (home.php) from wich i've to go to another page.
home.php
<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>
<!-- This is the default home page -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Animania Manager</title>
<link rel="stylesheet" href="application/styles/foundation.css">
<link rel="stylesheet" href="application/styles/app.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.11/css/jquery.dataTables.min.css" />
<link rel="stylesheet" href="application/styles/reset.css"> <!-- CSS reset -->
<link rel="stylesheet" href="application/styles/style.css"> <!-- Gem style -->
<script src="application/js/modernizr.js"></script> <!-- Modernizr -->
<script src="http://code.jquery.com/jquery-1.12.0.min.js"></script>
<!--script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script-->
<script src="https://cdn.datatables.net/1.10.11/js/jquery.dataTables.min.js"></script>
<script>
$(document).ready(function() {
$('#offerte').DataTable();
} );
$(document).ready(function() {
$('#curriculum').DataTable();
} );
</script>
<script>
$(document).ready(function() {
// Setup - add a text input to each footer cell
$('#offerte tfoot th').each( function () {
var title = $(this).text();
$(this).html( '<input type="text" placeholder="Cerca '+title+'" /> ');
} );
// DataTable
var table = $('#offerte').DataTable();
// Apply the search
table.columns().every( function () {
var that = this;
$( 'input', this.footer() ).on( 'keyup change', function () {
if ( that.search() !== this.value ) {
that
.search( this.value )
.draw();
}
} );
} );
} );
$(document).ready(function() {
// Setup - add a text input to each footer cell
$('#curriculum tfoot th').each( function () {
var title = $(this).text();
$(this).html( '<input type="text" placeholder="Cerca '+title+'" /> ');
} );
// DataTable
var table = $('#curriculum').DataTable();
// Apply the search
table.columns().every( function () {
var that = this;
$( 'input', this.footer() ).on( 'keyup change', function () {
if ( that.search() !== this.value ) {
that
.search( this.value )
.draw();
}
} );
} );
} );
</script>
</head>
<body>
<div class="container row">
<header class="testata" role="banner">
<nav class="menu">
<ul>
<li>Inserimento offerta</li>
<li>Inserimento CV</li>
<li></li>
</ul>
</nav>
<nav class="main-nav">
<ul>
<!-- inser more links here -->
<li><a class="cd-signin" href="#0">Login</a></li>
<li><a class="cd-signup" href="#0">Registrazione</a></li>
</ul>
</nav>
</header>
</div>
<div class="cd-user-modal"> <!-- this is the entire modal form, including the background -->
<div class="cd-user-modal-container"> <!-- this is the container wrapper -->
<ul class="cd-switcher">
<li>Login</li>
<li>Nuovo account</li>
</ul>
<div id="cd-login" action="validation.php" method=GET> <!-- log in form -->
<form class="cd-form">
<p class="fieldset">
<label class="image-replace cd-email" for="signin-email">E-mail</label>
<input class="full-width has-padding has-border" id="signin-email" type="email" placeholder="E-mail" name="email">
<span class="cd-error-message">Errore</span>
</p>
<p class="fieldset">
<label class="image-replace cd-password" for="signin-password">Password</label>
<input class="full-width has-padding has-border" id="signin-password" type="text" placeholder="Password" name="password">
Nascondi
<span class="cd-error-message">Errore!</span>
</p>
<p class="fieldset">
<input type="checkbox" id="remember-me" checked>
<label for="remember-me">Ricordami</label>
</p>
<p class="fieldset">
<input class="full-width" type="submit" value="Login">
</p>
</form>
<p class="cd-form-bottom-message">Hai dimenticato la password?</p>
<!-- Close -->
</div> <!-- cd-login -->
<div id="cd-signup"> <!-- sign up form -->
<form class="cd-form">
<p class="fieldset">
<label class="image-replace cd-username" for="signup-username">Username</label>
<input class="full-width has-padding has-border" id="signup-username" type="text" placeholder="Username">
<span class="cd-error-message">Errore!</span>
</p>
<p class="fieldset">
<label class="image-replace cd-email" for="signup-email">E-mail</label>
<input class="full-width has-padding has-border" id="signup-email" type="email" placeholder="E-mail">
<span class="cd-error-message">Errore!</span>
</p>
<p class="fieldset">
<label class="image-replace cd-password" for="signup-password">Password</label>
<input class="full-width has-padding has-border" id="signup-password" type="text" placeholder="Password">
Nascondi
<span class="cd-error-message">Errore!</span>
</p>
<p class="fieldset">
<input type="checkbox" id="accept-terms">
<label for="accept-terms">Accetto i Termini</label>
</p>
<p class="fieldset">
<input class="full-width has-padding" type="submit" value="Crea account">
</p>
</form>
<!-- Close -->
</div> <!-- cd-signup -->
<div id="cd-reset-password"> <!-- reset password form -->
<p class="cd-form-message">Hai perso la tua password? Inserisci il tuo indirizzo email. Riceverai un link per la creazione di una nuova password!</p>
<form class="cd-form">
<p class="fieldset">
<label class="image-replace cd-email" for="reset-email">E-mail</label>
<input class="full-width has-padding has-border" id="reset-email" type="email" placeholder="E-mail">
<span class="cd-error-message">Errore!</span>
</p>
<p class="fieldset">
<input class="full-width has-padding" type="submit" value="Reset password">
</p>
</form>
<p class="cd-form-bottom-message">Torna al log-in</p>
</div> <!-- cd-reset-password -->
Chiudi
</div> <!-- cd-user-modal-container -->
</div> <!-- cd-user-modal -->
<?php
if ($offers !== FALSE) {
print('<div>
<table class="display" id="offerte" cellspacing="0" width="100%">
<thead>
<tr>
<th>Titolo</th>
<th>Descrizione</th>
<th>Candidati</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Titolo</th>
<th>Descrizione</th>
<th>Candidati</th>
</tr>
</tfoot><tbody>');
//for($i = 0; $i < count($offers); $i++){
foreach ($offers as $offer){
//echo base_url();
//$url=base_url('single-offerta')."?idannunci=".$offer->getId();
print("<tr>");
print("<td>".$offer->getTitolo()."</td>");
print("<td>".$offer->getDescrizione()."</td>");
//print('<td>'.$offer->getPartecipanti().'</td>');
print('<td>'.anchor('Singoff2', 'Link Text').'</td>');
print("</tr>");
}
print("</tbody></table></div>");
}
else
{
echo 'nessuna offerta';
} ?>
<!--script src="js/vendor/jquery.js"></script-->
<script src="application/js/vendor/what-input.js"></script>
<script src="application/js/vendor/foundation.js"></script>
<script src="application/js/app.js"></script>
<script src="application/js/main.js"></script> <!-- Gem jQuery -->
</div>
</body>
</html>
Singoff2.php (controller to the other page)
<?php
if ( ! defined('BASEPATH')) exit('No direct script access allowed');
class Single-offerta extends CI_Controller {
public function index()
{
$this->load->library("SingOffFactory");
//Create a data array so we can pass information to the view
$data = array(
"dettagli" => $this->singofffactory->getDettagli()
);
//Load the view and pass the data to it
$this->load->view("Singoff2", $data);
}
}
If i try my link i have the error below:
Parse error: syntax error, unexpected '-', expecting '{' in D:\inetpub\webs\animaniait\manager\application\controllers\Singoff2.php on line 4
A PHP Error was encountered
Severity: Parsing Error
Message: syntax error, unexpected '-', expecting '{'
Filename: controllers/Singoff2.php
Line Number: 4
Backtrace:
Now if i try to change the class name in my Singoff.php file i have a 404 error.
Please help me.....i'm going crazy!!
Just read the error. It is line 4 and invalid character - - hyphen. Dashes or hyphens are NOT allowed in class names.
Class name should follow file name, meaning those two need to be exact the same.
Warm advice would be to read full CI documentation. Pay attention on file naming and class and method naming. Also, it could be very helpful to read PHP OOP basics.
A valid class name starts with a letter or underscore, followed by any number of letters, numbers, or underscores. As a regular expression, it would be expressed thus: ^[a-zA-Z_\x7f-\xff][a-zA-Z0-9_\x7f-\xff]*$.
In your example file should be Single_offerta.php and line 4 should be accordingly
class Single_offerta extends CI_Controller {
If you want to access your URL with example.com/single-offerta most efficient way would be to translate uri dashes in APPPATH.'config/routes.php' file setting it to TRUE:
$route['translate_uri_dashes'] = TRUE;
rename your class name Single-offerta to something else. avoid using - in your class name
Related
I have select option (dropdown list) inside a modal in which the option are getting printed below the dropdownlist... I tried checking if the code works if i redirect the page and works, like the options are inside the dropdown box but same thing inside modal doesn't work? Any solutions would be helpful.
add_details.blade
<div class="container">
<div class="row">
<div class="col">
<div>
<h2>Enter Your Details</h2>
<form action="{{ route('save') }}" method="POST" enctype="multipart/form-data">
#csrf
<div>
<div>
<span style="color:black">
<select class="form-control" name="collegeID" id="college_name" required />
<option value="" disabled selected hidden>Select College</option>
#foreach ($college_names as $college_name)
<option value="{{$college_name->collegeID}}">
{{ $college_name->college_name }}
</option>
#endforeach
</select>
</span>
</div>
</div>
<br />
<div class="col-xs-12 col-sm-12 col-md-12">
<div class="form-group">
<input type="radio" value="Cbse" name="regno">
<label for="" style="color:black">CBSE</label>
<input type="radio" value="State" name="regno"> <label style="color:black">PUC</label>
<input type="radio" value="State" name="regno"> <label style="color:black">State</label>
<div id="showCbse" class="myDiv">
<label for="regno" class="form-label"><span style="color:black">Admission Number</span></label>
<input type="number" name="regno" class="form-control" placeholder="Enter valid Admission Number" />
#if ($errors->has('regno'))
<span class="text-danger">{{ $errors->first('regno') }}</span>
#endif
</div>
<div id="showState" class="myDiv">
<label for="regno" class="form-label"><span style="color:black">Register Number</span></label>
<input type="number" name="regno" class="form-control" placeholder="Enter valid Register Number" />
#if ($errors->has('regno'))
<span class="text-danger">{{ $errors->first('regno') }}</span>
#endif
</div>
</div>
</div>
</br>
<label for="name" class="form-label"><span style="color:black">Name</span></label>
<input type="text" name="name" class="form-control" value="{{old('name')}}" placeholder="Enter Name" required />
#if ($errors->has('name'))
<span class="help-block font-red-mint">
<strong>{{ $errors->first('name') }}</strong>
</span>
#endif
</div>
<div>
</br>
<label for="address" class="form-label"><span style="color:black">Address</span></label>
<input type="text" name="address" value="{{old('address')}}" class="form-control" placeholder="Enter Address" required />
#if ($errors->has('address'))
<span class="help-block font-red-mint">
<strong>{{ $errors->first('address') }}</strong>
</span>
#endif
</div>
<div>
</br>
<label for="yop" class="form-label"><span style="color:black">Year Of Passing</span></label>
<input type="date" name="yop" value="{{old('yop')}}" class="form-control" placeholder="Enter Year Of Passing" required />
#if ($errors->has('yop'))
<span class="help-block font-red-mint">
<strong>{{ $errors->first('yop') }}</strong>
</span>
#endif
</div>
<div>
</br>
<label for="email" class="form-label"><span style="color:black">Email</span></label>
<input type="email" name="email" value="{{old('email')}}" class="form-control" placeholder="Enter Email" required />
#if ($errors->has('email'))
<span class="help-block font-red-mint">
<strong>{{ $errors->first('email') }}</strong>
</span>
#endif
</div>
<div>
</br>
<label for="phone" class="form-label"><span style="color:black">Phone Number</span></label>
<input type="number" name="phone" value="{{old('phone')}}" class="form-control" placeholder="Enter Phone Number" required />
#if ($errors->has('phone'))
<span class="help-block font-red-mint">
<strong>{{ $errors->first('phone') }}</strong>
</span>
#endif
</div>
<br /> <br />
<div class="col-md-4">
</br>
<button type="submit" class="btn btn-primary">Add</button>
</form>
<button type="submit" class="btn btn-primary">Back</button>
</div>
</div>
<style>
.myDiv {
display: none;
padding: 10px;
}
</style>
<script>
$(document).ready(function() {
$('input[type="radio"]').click(function() {
var demovalue = $(this).val();
$("div.myDiv").hide();
$("#show" + demovalue).show();
});
});
</script>
add.blade (page where the modal pops up)
<link href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" rel="stylesheet">
<link href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css" rel="stylesheet">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/jquery.validate.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/dataTables.bootstrap4.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.20/b-1.6.1/b-flash-1.6.1/b-html5-1.6.1/b-print-1.6.1/r-2.2.3/datatables.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.1/umd/popper.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.0/js/bootstrap.min.js"></script>
<!-- Font Awesome -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/js/all.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<!-- Datepicker -->
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<link href="css/bootstrap-select.min.css" rel="stylesheet" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="js/bootstrap-select.min.js"></script>
#extends('auth.dashboard')
#section('title')
Dashboard
#endsection
#section('body')
#if(Session::has('success'))
<div class="alert alert-success alert-dismissible">
{{Session::get('success')}}
</div>
#elseif(Session::has('failed'))
<div class="alert alert-success alert-dismissible">
{{Session::get('failed')}}
</div>
#endif
<body>
</br>
<div class="container">
<div class="row">
<div class="col">
<div>
<div class="pull-right">
<a class="btn btn-primary" title="Add"
href="{{route('add_details')}}"><i class="fas fa-plus-circle"></i></a>
<a class="btn btn-sm" data-toggle="modal" id="mediumButton" data-target="#mediumModal" data-attr="{{ route('add_details')}}" title="Add Institute Details"> ADD
</a>
</div>
</br>
</br>
</br>
<div class="row">
<div class="col-12 table-responsive">
<table class="table table-striped table-bordered user_datatable" id="user_datatable">
<thead class="thead-dark div-2">
<tr>
<center> <th><strong><span style="color:white">ID</span></strong></th> </center>
<th><strong><span style="color:white">Name</span></strong></th>
<th><span style="color:white">Status</span></th>
<th width="15%"><span style="color:white">Action</span></th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</div>
<!-- medium modal -->
<div class="modal fade" id="mediumModal" tabindex="-1" role="dialog" aria-labelledby="mediumModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body" id="mediumBody">
<div>
<!-- the result to be displayed apply here -->
</div>
</div>
</div>
</div>
</div>
</body>
<script type="text/javascript" src="https://cdn.datatables.net/v/bs4/jszip-2.5.0/dt-1.10.20/b-1.6.1/b-flash-1.6.1/b-html5-1.6.1/b-print-1.6.1/r-2.2.3/datatables.min.js">
</script>
<script type="text/javascript" src="https://cdn.datatables.net/responsive/2.2.7/js/dataTables.responsive.min.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
$.noConflict();
fill_datatable();
function fill_datatable(collegeID = '') {
var table = $('.user_datatable').DataTable({
order: [
[0, 'desc']
],
processing: true,
serverSide: true,
ajax: {
url: "{{ route('alumni.datatable') }}",
data: {
collegeID: collegeID
}
},
columns: [{
data: 'id',
name: 'id'
},
{
data: 'name',
name: 'name'
},
{
data: 'status',
name: 'status',
mRender: function(data) {
if (data == '1') {
return '<center><span class = "btn btn-danger btn-sm" > Pending </span></center>'
}
if (data == '0') {
return '<center><span class = "btn btn-success btn-sm" > Approved </span></center>'
}
}
},
{
data: 'action',
name: 'action',
orderable: false,
searchable: false
},
]
});
}
$('#filter').click(function() {
var collegeID = $('#college_name').val();
if (collegeID != '') {
$('#user_datatable').DataTable().destroy();
fill_datatable(collegeID);
} else {
alert('Select Both filter option');
}
});
});
</script>
<script>
// display a modal (medium modal)
$(document).on('click', '#mediumButton', function(event) {
event.preventDefault();
let href = $(this).attr('data-attr');
$.ajax({
url: href,
beforeSend: function() {
$('#loader').show();
},
// return the result
success: function(result) {
$('#mediumModal').modal("show");
$('#mediumBody').html(result).show();
},
complete: function() {
$('#loader').hide();
},
error: function(jqXHR, testStatus, error) {
console.log(error);
alert("Page " + href + " cannot open. Error:" + error);
$('#loader').hide();
},
timeout: 8000
})
});
</script>
#endsection
It's minor mistake all devs do :D , I also did this type of mistake.
use
<select class="form-control" name="collegeID" id="college_name" required>
Instead of this
<select class="form-control" name="collegeID" id="college_name" required />
Just remove close tag from end of the start tag.
i am facing ErrorException Array to string conversion, I am new in laravel. please help me in detail if you can,please help me in detail if you can please help me in detail if you can please help me in detail if you can please help me in detail if you can please help me in detail if you can please help me in detail if you can please help me in detail if you can
This is my code
<?php
namespace App\Http\Controllers;
use Redirect,Response;
use Illuminate\Http\Request;
use App\Models\Test;
use File;
class JsonController extends Controller
{
public function index()
{
return view('json_form');
}
public function download(Request $request)
{
$data = $request->only('name','email','mobile_number');
$test['token'] = time();
$test['data'] = json_encode($data);
Test::insert($test);
$fileName = $test['token']. '_datafile.json';
File::put(public_path('/upload/json/'.$fileName),$test);
//return download(public_path('/upload/jsonfile/'.$fileName));
$headers = [ 'Content-Type' => 'application/json', ];
return response()->download($test, 'filename.json', $headers);
//return response()->download(public_path('file_path/from_public_dir.pdf'));
}
}
This is my jeson.blade.php
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>Laravel Store Data To Json Format In Database - Tutsmake.com</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" />
<style>
.error{ color:red; }
</style>
</head>
<body>
<div class="container">
<h2 style="margin-top: 10px;">Laravel Store Data To Json Format In Database - Tutsmake.com</h2>
<br>
<br>
#if ($message = Session::get('success'))
<div class="alert alert-success alert-block">
<button type="button" class="close" data-dismiss="alert">×</button>
<strong>{{ $message }}</strong>
</div>
<br>
#endif
<form id="laravel_json" method="post" action="json-file-download">
#csrf
<div class="form-group">
<label for="formGroupExampleInput">Name</label>
<input type="text" name="name" class="form-control" id="formGroupExampleInput" placeholder="Please enter name">
</div>
<div class="form-group">
<label for="email">Email Id</label>
<input type="text" name="email" class="form-control" id="email" placeholder="Please enter email id">
</div>
<div class="form-group">
<label for="mobile_number">Mobile Number</label>
<input type="text" name="mobile_number" class="form-control" id="mobile_number" placeholder="Please enter mobile number">
</div>
<div class="form-group">
<button type="submit" class="btn btn-success">Submit</button>
</div>
</form>
</div>
</body>
</html>
I am new to Vue.js. I am trying to make a form dynamic (only a certain part of the form dynamic.). A user can have multiple guarantors. So I made the Guarantor form Dynamic with VueJS. When I submit the form and return the request, I see only the last array. Its always the last array, all others are lost.
This is the blade file.
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="{{ asset('css/app.css')}}">
<title>Laravel</title>
</head>
<body>
<div id="app">
<div class="container pt-5">
<form action="{{ route('submit.store')}}" method="post">
#csrf
<div class="card-body">
<h4 class="card-title">User Detail</h4>
<input type="text" class="form-control mb-1" name="user_name" id="user_name" placeholder="Name" />
<input type="email" class="form-control mb-1" name="user_email" id="user_email"
placeholder="Email" />
<textarea name="about" class="form-control" id="about" cols="30" rows="10"
placeholder="About"></textarea>
</div>
<dynamic-form></dynamic-form>
</form>
</div>
</div>
<script src="{{ asset('js/app.js') }}"></script>
</body>
</html>
And this is how the VueComponent looks.
<template>
<div>
<button class="btn btn-success mb-3" #click.prevent="addNewUser">Add User</button>
<div class="card mb-3" v-for="(user, index) in users" :key="index">
<div class="card-body">
<span class="float-right" style="cursor:pointer" #click.prevent="removeForm(index)" >X</span>
<h4 class="card-title">Guarantor No: {{ index }}</h4>
<input type="text" class="form-control mb-1" name="name" id="name" placeholder="Name" v-model="user.name" />
<input type="email" class="form-control mb-1" name="email" id="email" placeholder="Email" v-model="user.email"/>
<textarea name="about" class="form-control" id="about" cols="30" rows="10" placeholder="About" v-model="user.about"></textarea>
</div>
</div>
<input type="submit" class="btn btn-primary" value="submit">
</div>
</template>
<script>
export default {
name: 'dynamic-form',
data() {
return{
users: [
{
name: '',
email: '',
about: ''
}
]
}
},
methods: {
addNewUser: function() {
this.users.push({
name: '',
email: '',
about: ''
});
},
removeForm: function(index) {
this.users.splice(index, 1);
}
}
}
</script>
How can I tackle this problem?
In PHP, values with the same name attribute value will get overwritten. (See the "How do I get all the results from a select multiple HTML tag?" section here).
You can create arrays of values by adding a bracket to the name. For example, if you made the name of the "name" input name[], name will be an array of names in PHP.
In your case, you could use this format: name="guarantors[][name]". That way you will get an array in PHP under the key guarantors (e.g. $request->guarantors) and each of the values in guarantors will be an array with the values name, email, etc.
Please can some one point me in the right direction with this code.
When my form has been submitted a message is displayed however at the moment the Submit Button is still present.
I want to remove/hide the submit button once the form has been successfully submitted and the Success Message is being displayed.
I have looked around for answers on stack-overflow but so far everything I have tried has not worked.
Im sure I need to add something like this:
$('#sky-form button[type="submit"]').hide();
However I think maybe there is something already in the code that is stopping this from happening.
Here is my submit and message part of my form:
<button type="submit" button class="border-button">NEXT</button>
<div class="message">
<i class="fa fa-check"></i>
<p>Thanks for your order!<br>We'll contact you very soon.</p>
</form>
And here is the ajax:
submitHandler: function(form)
{
$(form).ajaxSubmit(
{
beforeSend: function()
{
$('#sky-form button[type="submit"]').addClass('button-uploading').attr('disabled', true);},
uploadProgress: function(event, position, total, percentComplete)
{
$("#sky-form .progress").text(percentComplete + '%');
},
success: function()
{
$("#sky-form").addClass('submited');
$('#sky-form button[type="submit"]').removeClass('button-uploading').attr('disabled', false);
}
});
},
Thanks so much to anyone that can help with this.
FULL CODE:
<form action="demo-order-process.php" method="post" enctype="multipart/form-data" id="sky-form" class="sky-form">
<fieldset>
<div class="row">
<div class="col-md-4" align="left">
<label class="input">
<input type="text" name="home_address" placeholder="Home Address">
<b class="tooltip tooltip-bottom-left">Enter your home address</b>
</label>
</div>
<div class="col-md-4" align="left">
<label class="input">
<input type="text" name="biz_address" placeholder="Biz Address">
<b class="tooltip tooltip-bottom-left">Enter your biz address</b>
</label>
</div>
</div><!-- END OF ROW DIV -->
</fieldset>
<!-- FORM ONE DATA -->
<input type="hidden" name="name"
value="<?php echo $_POST['name']; ?>">
<input type="hidden" name="email"
value="<?php echo $_POST['email']; ?>">
<!-- END OF FORM TWO DATA -->
<!-- FORM TWO DATA -->
<input type="hidden" name="mobile"
value="<?php echo $_POST['mobile']; ?>">
<input type="hidden" name="home"
value="<?php echo $_POST['home']; ?>">
<!-- END OF FORM TWO DATA -->
<div class="row">
<div class="col-md-4" align="left">
<button type="submit" button class="border-button">NEXT</button>
</div>
</div><!-- END OF ROW DIV -->
<div class="message">
<i class="fa fa-check"></i>
<p>Thanks for your order!<br>We'll contact you very soon.</p>
</div>
</form>
</div>
<!-- START OF JS VALIDATION -->
<script type="text/javascript">
$(function()
{
$("#sky-form").validate(
{
rules:
{
home_address:
{
required: true
},
biz_address:
{
required: true
},
messages:
{
home_address:
{
required: 'Please enter your home address'
},
biz_address:
{
required: 'Please enter your business address'
},
},
// Ajax form submition
submitHandler: function(form)
{
$(form).ajaxSubmit(
{
beforeSend: function()
{
$('#sky-form button[type="submit"]').addClass('button-uploading').attr('disabled', true);
},
uploadProgress: function(event, position, total, percentComplete)
{
$("#sky-form .progress").text(percentComplete + '%');
},
success: function()
{
$("#sky-form").addClass('submited');
$('#sky-form button[type="submit"]').removeClass('button-uploading').attr('disabled', false);
}
});
},
errorPlacement: function(error, element)
{
error.insertAfter(element.parent());
}
});
});
</script>
<!-- END OF JS VALIDATION -->
JQuery Librarys:
`
<!-- fort forms -->
<script src="../form/jquery.min.js"></script>
<script src="../form/jquery-ui.min.js"></script>
<script src="../form/jquery.form.min.js"></script>
<script src="../form/jquery.validate.min.js"></script>
<!-- for page finctions -->
<!-- PROBLEM FILE = <script type="text/javascript" src="../js/jquery-1.11.0.min.js"></script>-->
<script type="text/javascript" src="../js/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="../js/bootstrap.min.js"></script>
<script type="text/javascript" src="../js/jquery.mb.YTPlayer.min.js"></script>
<script type="text/javascript" src="../js/jquery.flexslider-min.js"></script>
<script type="text/javascript" src="../js/perfect-scrollbar.js"></script>
<script type="text/javascript" src="../js/plugins.js"></script>
<script type="text/javascript" src="../js/main.js"></script>`
I just tried this code and seems to be working.
If it did not work please check the error you are getting in console.
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="http://jqueryvalidation.org/files/dist/jquery.validate.js"></script>
<script src="http://malsup.github.com/jquery.form.js"></script>
<form action="demo-order-process.php" method="post" enctype="multipart/form-data" id="sky-form" class="sky-form">
<fieldset>
<div class="row">
<div class="col-md-4" align="left">
<label class="input">
<input type="text" name="home_address" placeholder="Home Address">
<b class="tooltip tooltip-bottom-left">Enter your home address</b>
</label>
</div>
<div class="col-md-4" align="left">
<label class="input">
<input type="text" name="biz_address" placeholder="Biz Address">
<b class="tooltip tooltip-bottom-left">Enter your biz address</b>
</label>
</div>
</div><!-- END OF ROW DIV -->
</fieldset>
<!-- FORM ONE DATA -->
<input type="hidden" name="name" value="<?php echo $_POST['name']; ?>">
<input type="hidden" name="email" value="<?php echo $_POST['email']; ?>">
<!-- END OF FORM TWO DATA -->
<!-- FORM TWO DATA -->
<input type="hidden" name="mobile" value="<?php echo $_POST['mobile']; ?>">
<input type="hidden" name="home" value="<?php echo $_POST['home']; ?>">
<!-- END OF FORM TWO DATA -->
<div class="row">
<div class="col-md-4" align="left">
<button type="submit" button class="border-button">NEXT</button>
</div>
</div><!-- END OF ROW DIV -->
<div class="message">
<i class="fa fa-check"></i>
<p>Thanks for your order!<br>We'll contact you very soon.</p>
</div>
</form>
<!-- START OF JS VALIDATION -->
<script type="text/javascript">
$(function()
{
$("#sky-form").validate({
rules:
{
home_address:
{
required: true
},
biz_address:
{
required: true
}
},
messages:
{
home_address:
{
required: 'Please enter your home address'
},
biz_address:
{
required: 'Please enter your business address'
},
},
// Ajax form submition
submitHandler: function(form) {
$(form).ajaxSubmit(
{
beforeSend: function()
{
$('#sky-form button[type="submit"]').addClass('button-uploading').attr('disabled', true);
},
uploadProgress: function(event, position, total, percentComplete)
{
$("#sky-form .progress").text(percentComplete + '%');
},
success: function()
{
$("#sky-form").addClass('submited');
$('#sky-form button[type="submit"]').removeClass('button-uploading').attr('disabled', false);
$('#sky-form button[type="submit"]').hide();
}
});
},
errorPlacement: function(error, element)
{
error.insertAfter(element.parent());
}
});
});
</script>
<!-- END OF JS VALIDATION -->
pinterest js
<script type="text/javascript">
(function(d){
var f = d.getElementsByTagName('SCRIPT')[0], p = d.createElement('SCRIPT');
p.type = 'text/javascript';
p.async = true;
p.src = '//assets.pinterest.com/js/pinit.js';
f.parentNode.insertBefore(p, f);
}(document));
</script>
css files
<link rel='stylesheet' href='css/fab-sales.css' media='all' type='text/css' />
<link rel='stylesheet' href='css/basic.css' media='all' type='text/css' />
codes
{if isset($products)}
<!-- Products list -->
<ul id="product_list" class="clear">
{foreach from=$products item=product name=products}
{assign var=foo value=$product.link}
<li class="ajax_block_product {if $smarty.foreach.products.first}first_item{elseif $smarty.foreach.products.last}last_item{/if} {if $smarty.foreach.products.index % 2}alternate_item{else}item{/if} clearfix">
<div class="left_block">
{if isset($comparator_max_item) && $comparator_max_item}
<p class="compare">
<input type="checkbox" class="comparator" id="comparator_item_{$product.id_product}" value="comparator_item_{$product.id_product}" {if isset($compareProducts) && in_array($product.id_product, $compareProducts)}checked="checked"{/if} />
<label for="comparator_item_{$product.id_product}">{l s='Select to compare'}</label>
</p>
{/if}
</div>
<div class="center_block">
<div align="center" id="prodList">
<div class="product">
<div class="prodImgBlock filler" style="cursor:pointer"><a href="{$foo|escape:'htmlall':'UTF-8'}" class="product_img_link" title="{$product.name|escape:'htmlall':'UTF-8'}"><img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home_default')}" alt="{$product.legend|escape:'htmlall':'UTF-8'}" {if isset($homeSize)} width="{$homeSize.width}" height="{$homeSize.height}"{/if} />{if isset($product.new) && $product.new == 1}<span class="new">{l s='New'}</span>{/if}
</a></div>
<div class="newSocialCt">
<div class="newSocialToolBar"> <span style="left: 10px;" class="newSocialTool faveIt"> <span style="position: relative;top: 4px;display: none;" class="loader"> <img src="img/tmp/ajax-loader-white.gif"> </span></span> <span class="loaderCt newSocialTool"></span> <span class="newSocialTool pinItTool" style="float:left; margin-left:-10px; margin-right:5px;"> <img src="//assets.pinterest.com/images/pidgets/pin_it_button.png" /> </span> <span class="newSocialTool" style="float:left; width:85px; margin-left:15px;">
<div id='basic-modal'> <a href='#' class='basic'><img alt="Share" src="img/tmp/tellafriend.png" border="0" /></a> </div>
</span> <span class="newSocialTool" style="float:none; margin-right:20px;">
<div class="fb-like" data-href="$foo" data-send="false" data-layout="button_count" data-width="450" data-show-faces="true"></div>
</span> </div>
</div> </div>
</div>
<div class="productCt">
<div class="productDet" id="0"><h4>{$product.name|escape:'htmlall':'UTF-8'|truncate:35:'...'}</h4>
<p class="product_desc"><a href="{$product.link|escape:'htmlall':'UTF-8'}" title="{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}" >{$product.description_short|strip_tags:'UTF-8'|truncate:130:'...'}</a></p>
</div>
</div></div>
<div id="push" class="clear"></div>
<div id="basic-modal-content">
<div id="tellFriendBox">
<div class="popUpHd">
<h2>Tell A Friend!</h2>
</div>
<div class="error" id="tf"></div>
<form class="" id="" method="post" action="" enctype="multipart/form-data">
<div class="eachRow">
<div>Your Name
<label style="color:#FF0000">*</label>
:</div>
<div class='field'>
<input type='text' id="name" class="required email" name="name" size='33'/>
</div>
</div>
<div class="eachRow">
<div>Friends Email Address
<label style="color:#FF0000">*</label>
:</div>
<div class='field'>
<input type='text' id="email_id" class="required email" name="email" size='33'/>
</div>
</div>
<div class="eachRow">
<div>Matter:</div>
<div class='field'>
<textarea rows='4' cols='25' id="matter" class="required" name="matter" ></textarea>
</div>
</div>
<div class="eachRow">
<div class='field'>
<input class="button" type='submit' name="tellafriend" onclick="return TellFriend(); " value="Send Mail"/>
</div>
</div>
</form>
</div>
</div>
<div style='display:none'> <img src='img/tmp/x.png' alt='' /> </div>
***after putting following javascript code for validation smarty template getting blank
<script type="text/javascript">
function TellFriend()
{
var em = /^[a-zA-Z0-9._-]+#[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
if(document.getElementById("name").value == "")
{
document.getElementById("tf").innerHTML= "* Marks Fields are Mandatory ";
document.getElementById("name").focus();
return false;
}
if(document.getElementById("email_id").value == "")
{
document.getElementById("tf").innerHTML= "* Marks Fields are Mandatory ";
document.getElementById("email_id").focus();
return false;
}
if (document.getElementById("email_id").value.search(em) == -1)
{
document.getElementById("tf").innerHTML= "Invalid Email "+"</span>";
document.getElementById("email_id").focus();
return false;
}
}
</script>
need help..and after putting $foo as URL in pinterest..pinterest count button disappering..
You should enclose the javascript in {literal}{/literal} tags
There is the great article for undestand debug process: http://blog.belvg.com/showing-php-and-sql-errors-and-debugging-a-blank-white-page-in-prestashop.html