se puede llamar a un php desde una funcios js??

Hola a todos!!!

Soy nueva ene esto del js y el php, he hecho un formulario con js y quiero que para guardarse llame a un php que envia por correo, pero no se como hacerlo.
llevo varios días dando vueltas y no encuentro la solución si alguien me ayudase estaria muy agradecida.
Aqui les dejo el código:


<script>

function ModalPopupsCustom1() {
ModalPopups.Custom("idCustom1",
"Formulario de Contacto",
"<fieldset>" +
"<form id='formulario1' name='formulario1' method='post' action='submit.php' >" +
"<table>" +
"<tr><td><label for='name'>Nombre</label></td>" +
"<td><input type=text id='inputCustom1Name' name='inputCustom1Name'style='width:250px;'></td></tr>" +
"<tr><td><label for='email'>Email</label></td>" +
"<td><input type=text id='inputCustom1Email' name='inputCustom1Email' style='width:250px;'></td></tr>" +
"<tr><td><label for='phone'>Teléfono</label></td>" +
"<td><input type=text id='inputCustom1Phone' name='inputCustom1Phone' style='width:100px;'></td></tr>" +
"<tr><td><label for='question'>Asunto</label></td>" +
"<td><input type=text id='inputCustom1Question' name='inputCustom1Question' style='width:250px;'></td></tr>" +
"<tr><td><label for='text'>Cuéntame</label></td>" +
"<td><input type=text id='inputCustom1Text' name='inputCustom1Text' style='width:250px;'></td></tr>" +
"</table>" +
"</fieldset>" +
"</form>",


{
width: 500,
buttons: "ok,cancel",
okButtonText: "Save",
cancelButtonText: "Cancel",
onOk: "ModalPopupsCustom1Save()",
onCancel: "ModalPopupsCustom1Cancel()"
}
);



ModalPopups.GetCustomControl("inputCustom1Name").focus();
}

function ModalPopupsCustom1Save() {
var custom1Name = ModalPopups.GetCustomControl("inputCustom1Name");
if(custom1Name.value == "")
{
alert("REllena los campos vacios");
custom1Name.focus();
}
else
{
alert("Your name is: " + custom1Name.value);
ModalPopups.Close("idCustom1");
}
}

function ModalPopupsCustom1Cancel() {
alert('You pressed Cancel');
ModalPopups.Cancel("idCustom1");
}

</script>


<script type="text/javascript" src="js/shInit.js" language="javascript"></script>




Y este es el php al que quiero que llame:

<?php


$name=$_REQUEST['inputCustom1Name'];
$email=$_REQUEST['inputCustom1Email'];
$phone=$_REQUEST['inputCustom1Phone'];
$question=$_REQUEST['inputCustom1Question'];
$text=$_REQUEST['inputCustom1Text'];



$error=0;


if($name=='' || $email=='' || $phone=='' || $question=='' ||
$text=='')
$error=1;


if($error==1){
header('Location:index.php?mensaje=Por%20favor%20rellene%20los%20campos%20vacios');
}else{

$mensaje="name:$name - email:$email - phone:$phone - question:$quetion - text:$text";

mail("[email protected]","Correo desde Web", $mensaje);

echo header('Location:index.php?mensaje=Gracias%20por%20contactar%20con%20nosotros');



}

?>

El script PHP apuntado en el action del form se ejecutará cuando envíes el formulario usando el método submit() del objeto form de JavaScript o bién si pones un botón tipo submit en el formulario. Eso es todo.

Gracias por la respuesta, eso funciona, pero no me respeta la funcion del popup, ami me gustaria que enviase el formulario sin perder la funcion del popup, que se cierra de forma diferente.
Muchas gracias

No estoy muy seguro pero en PHP puedes llamar una funcion JS con algo asi

Código PHP :

if ($var == 0) {

echo "<script>mi_funcion();</script>";

}

else {

echo "No pasa nada";

}

Pero no se ve bien. En realidad lo que estas haciendo es escribir HTML desde PHP

Yo lo que te recomiendo es que uses ajax,ṕuedes usar la libreria jquery para hacerlo.
Es la mejor forma para usar php desde Javascript


saludos

Yo uso esta cadena AJAX. te la pongo a ver si te vale, solo has de llamar a la función con previo apunte del Array(); que te explico en los comentarios.

Código Javascript :

var c=new Array();
var s=new Array();
var u=new Array();
var e=new Array();
var n=new Array();
// Comunicador con el servidor.
// c[4]=[URL,mensaje/info,String(función)];
s[4]=["POST","Content-type","application/x-www-form-urlencoded","Content-length","Connection","close"];
n[4]=[4,200,50];
e[4]=new XMLHttpRequest();
s[4]=function(){
   e[4].open(s[4][0],c[4][0],true);
   e[4].setRequestHeader(s[4][1],s[4][2]);
   e[4].setRequestHeader(s[4][3],c[4][1].length);
   e[4].setRequestHeader(s[4][4],s[4][5]);
   e[4].onreadystatechange=function(){
      if(e[4].readyState==n[4][0] && e[4].status==n[4][1]){
         window.c[4][3]=e[4].responseText;
         setTimeout(c[4][2],n[4][2]);
      };
   };
   e[4].send(c[4][1]);
};

Puede que sea algo caótico pero es que sino no me aclaro con páginas de 800 líneas y eso, así sé de donde viene todo. cada letra representa algo diferente, tal como la "e", que es elemento JS o AJAX, "n" que es número, "s" que es string, etc.

Bueno, a ver si te vale. ¡Un saludo!

Por cierto, se me olvidaba decirte que con este código no te hace falta refrescar la página ni linkearla ni nada, simplemente envía la información y continuará la cadena de funciones con la que le especifiques en c[4][2];.

Hola de nuevo!!!
hace ya algun tiempo publique este emnsaje y me gustaria continuarlo, les doy las gracias a todos, pero sus respuesta no me funcionaron.

Les dejo el codigo de nuevo, habher si alguien me puede decir como envio el formulario pop up sin que la página se recargue, esta bien hecho mediante php o hay otra forma... Yo no se mucho de js solo reciclo codigo. hay va:

este es formulario pop up y la funcion que lo envia llamando a un php.
HTML


<script>
function enviar_formulario(){
document.formulario1.submit();

}

</script>



<script>

function ModalPopupsCustom1() {
ModalPopups.Custom("idCustom1",
"<legend>Formulario de Contacto</legend>",
"<fieldset>" +
"<form id='formulario1' name='formulario1' method='post' action='submit2.php' >" +
"<table>" +
"<tr><td><label for='name'>Nombre</label></td>" +
"<td><input type=text id='inputCustom1Name' name='inputCustom1Name'style='width:200px;'></td></tr>" +
"<tr><td><label for='email'>Email</label></td>" +
"<td><input type=text id='inputCustom1Email' name='inputCustom1Email' style='width:200px;'></td></tr>" +
"<tr><td><label for='phone'>Teléfono</label></td>" +
"<td><input type=text id='inputCustom1Phone' name='inputCustom1Phone' style='width:100px;'></td></tr>" +
"<tr><td><label for='question'>Asunto</label></td>" +
"<td><input type=text id='inputCustom1Question' name='inputCustom1Question' style='width:200px;'></td></tr>" +
"<tr><td><label for='text'>Cuéntame</label></td>" +
"<td><input type=text id='inputCustom1Text' name='inputCustom1Text' style='width:200px;'></td></tr>" +
"</table>" +
"</fieldset>" +
"</form>",


{
width: 400,
buttons: "ok,cancel",
okButtonText: "enviar",
cancelButtonText: "cancelar",
onOk: "ModalPopupsCustom1Save()",
onCancel: "ModalPopupsCustom1Cancel()"
}
);



ModalPopups.GetCustomControl("inputCustom1Name").focus();
}

function ModalPopupsCustom1Save() {
var custom1Name = ModalPopups.GetCustomControl("inputCustom1Name");
if(custom1Name.value == "")
{
alert("Rellena los campos vacios");
custom1Name.focus();
}
else
{
alert("Gracias por contactar con nosotros" );
enviar_formulario();
}
}

function ModalPopupsCustom1Cancel() {
alert('¿Quieres cancelar?');
ModalPopups.Cancel("idCustom1");
}

</script>


este es el php que recoge los datos y envia al mail
PHP

<?php
$name=$_REQUEST['inputCustom1Name'];
$email=$_REQUEST['inputCustom1Email'];
$phone=$_REQUEST['inputCustom1Phone'];
$question=$_REQUEST['inputCustom1Question'];
$text=$_REQUEST['inputCustom1Text'];


$mensaje="name:$name - email:$email - phone:$phone - question:$quetion - text:$text";

mail("[email protected]","Correo desde Web", $mensaje);


?>



Y esta es la llamada a la funcio que cierra el pop up y no se donde devo ponerla.

ModalPopups.close("idCustom1");



Gracias de antemano.

Depende de en qué momento quieres que la ventana se cierre.
Pero como estás haciendo submit del form, eso ya no importa porque la página actual desaparecerá para cargarse 'submit2.php'.

Entonces ¿como puedo hacerlo?

Pues quisiera que la ventana del pop up se cierre una vez que se envie el formulario, pero en vez de eso, envia el formulario y depende de si le pongo el echo header(....), me lleva de nuevo a la página recargando la página, y si no le pongo nada se queda anclado en el php.

Poe eso pregunto si una vez que el php envie el formulalrio, puedo hacer que llame a la funcion javascript, no se si me explico

Creo que no lo había entendido ....
Una vez que la funcion enviar_formulario() se activa, el php se carga?? y entonces se cierra mi index??

Y como podria enviar el formulario sin que se cargue el php aunque si lo utilice?

creo que no me estoy explicando que complicado es esto.

Quieres que el php se ejecute sin ejecutarse .

Lo que estás buscando se llama AJAX. Es la única forma de lograr lo que quieres, es decir, que el formulario se envíe sin moverte de la página actual.

No voy a entrar en detalles porque tendría que escribir un curso de AJAX, te invito a que busques información aquí mismo, en Cristalab.

Ok!!!
Buscare haber que es lo que encuentro porque tengo un lio....
Muchas Gracias por contestar tan rápido. ;D
Ire comentando los progresos, gracias de nuevo.

He encontrado varios script de ajax, pero no se como usarlos, es un código muy avanzado para mi.
No entiendo el funcionamiento, yo ahora tengo una funcion que al hacer submit llama a un php que es el que recoge los valores del form y envia al email.
Con ajax no se quien recoge los valores ni como se envian por email, no me entero

Voy a poner de nuevo el codigo de mi página:
este seria el index:

<head>

<script src="js/utilidades.js" language="javascript"></script>

<script>

function enviar_formulario(){
document.formulario1.submit();
}

</script>

<strong><meta property="og:title" content="dise&ntilde;o-web-infograf&iacutea-multimedia" />
<meta property="og:type" content="product" />
<meta property="og:url" content="http://www.bikubika.com" />
<meta property="og:image" content="http://www.bikubika.com/images/bikubika.png" />
<meta property="og:site_name" content="bikubika-inma-postigo-bicubica" />
<meta property="fb:app_id" content="167455046645334" /></strong>



<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="title" content="Inma Postigo Dovao" />
<meta name="description" content="dise&ntilde;o-web-infograf&iacutea-multimedia" />
<meta name="keywords" content="Dise&ntilde;o-web-multimeia-3d-infografia-Branding-Redes-Sociales-Marketing-Design-Social-Network" />
<meta name="language" content="es" />
<meta name="expires" content="never" />
<meta name="robots" content="index,follow" />
<meta name="revisit-after" content="15 days" />
<meta name="author" lang="ES" content="Inma-Postigo" />
<meta name="expires" content="never" />
<meta name="Date-Creation-20090310" content="date" />
<meta name="Date-Revision-20090526" content="date" />

<title>Bikubika-Dise&ntilde;o-Infograf&iacutea-3d-Multimedia</title>
<link rel="stylesheet" type="text/css" href="css/style-gallerie.css"/>
<link rel="stylesheet" type="text/css" media="screen" href="css/style.css"/>
<link rel="stylesheet" type="text/css" media="screen" href="css/style_002.css"/>


<script type="text/javascript" src="js/shCore.js" language="javascript"></script>
<script type="text/javascript" src="js/shBrushJScript.js" language="javascript"></script>
<script type="text/javascript" src="js/ModalPopups.js" language="javascript"></script>


<script type="text/javascript" src="js/mootools-beta-1.2b1.js"></script>
<script type="text/javascript" src="js/mootools.js"></script>
<script type="text/javascript" src="js/demos.js"></script>

<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"/>

<script type="text/javascript">
window.addEvent('domready', function(){
var scroll = new Fx.Scroll('demo-wrapper', {
wait: false,
duration: 2500,
offset: {'x': -200, 'y': -50},
transition: Fx.Transitions.Quad.easeInOut
});

$('link1').addEvent('click', function(event) {
event = new Event(event).stop();
scroll.toElement('content1');
});

$('link2').addEvent('click', function(event) {
event = new Event(event).stop();
scroll.toElement('content2');
});

$('link3').addEvent('click', function(event) {
event = new Event(event).stop();
scroll.toElement('content3');
});

$('link4').addEvent('click', function(event) {
event = new Event(event).stop();
scroll.toElement('content4');
});

$('link5').addEvent('click', function(event) {
event = new Event(event).stop();
scroll.toElement('content1');
});
});
</script>

</head>

<body>
<div id="margin">
</div>

<div id="header">
<div id="logo">
<img src="images/bikubika.png" alt="logotipo" title="BIKUBIKA"/>
</div>

</div>
<div id="wrapper">

<div id="demo-wrapper">
<div id="demo-inner">
<div id="content1" class="scrolling-content">

<div id="p-inicio">
<h1 id="hini">INICIO</h1>

<p> <blockquote cite="http://es.wikiquote.org/wiki/Antoine_de_Saint-Exupery">"La perfecci&oacute;n se consigue, no cuando no haya m&aacute;s que a&ntilde;adir, sino cuando no hay nada m&aacute;s por quitar."</blockquote></p>
<p id="cita"><cite>Antoine de Saint-Exup&eacute;ry</cite></p>

<p class="parrafo">Bikubika nace con la finalidad de acercar al mundo una visi&oacute;n diferente de las cosas. Por ello en nuestros dise&ntilde;os sencillez, armon&iacute;a y elegancia se unen, para crear nuevas experiencias.</p>
<p class="parrafo">Sabemos que la presentaci&oacute;n de su empresa se hace a trav&eacutes de la publicidad, ya sea impresa, en su sito web, o en otro medio de difusi&oacute; n. Por lo que un dise&ntilde;o profesional reportara m&aacute; posibilidades a su negocio.</p>

</div>
</div>

<div id="content2" class="scrolling-content">

<div id="p-servicios">
<p><h1 id="hser">DISE&Ntilde;O · WEB · INFOGRAF&Iacute;A · MULTIMEDIA</h1></p>
<p class="parrafo">En Bikubika ofrecemos a nuestros clientes todos los servicios necesarios para un buen posicionamiento en el mercado. Desarrollamos proyectos completos de dise&ntilde;o, identidad corporativa, marketing, mailings, etc. Para que nuestros clientes no tengan que preocuparse de nada. </p>
</div>
</div>

<div id="content3" class="scrolling-content">
<h1 id="hport">PORTFOLIO</h1>
<div id="gallery">
<script src="scripts_ralcr/js/swfobject.js" type="text/javascript"></script>
<script src="scripts_ralcr/js/swfmacmousewheel2.js" type="text/javascript"></script>
<script src="scripts_ralcr/js/swfaddress.js" type="text/javascript"></script>

<script language="JavaScript">
var imagin_scripts_path = "scripts_ralcr/"; // a path relative to the html which embeds the swf
var imagin_photos_path = "photos/"; // a path relative to "scripts_ralcr" parent
var imagin_preferences_path = ""; // a path to the _preferences.xml (th eone from photos will be ignored)

var imagin_instance = "imagin_instance";
var imagin_swf_color = "#FFF";
var imagin_swf_width = "100%";
var imagin_swf_height= "100%";


// SWFObject embed by Geoff Stearns [email protected] http://blog.deconcept.com/
var flashvars = { id:imagin_instance, scripts_path:imagin_scripts_path, photos_path:imagin_photos_path, preferences_path:imagin_preferences_path };
var params = { allowFullScreen:'true', allowNetworking:'all', allowScriptAccess:'always', bgcolor:imagin_swf_color };
var attributes = { id:imagin_instance, name:imagin_instance };

swfobject.embedSWF ("imagin.swf?"+Math.random()*1, imagin_instance, imagin_swf_width, imagin_swf_height, "9",
imagin_scripts_path + "/embed/expressInstall.swf", flashvars, params, attributes);
swfmacmousewheel.registerObject( imagin_instance );
</script>


<div id="imagin_instance">
<p>Para poder ver la galler&iacutea , necesitas tener activado JavaScript y falsh player 9 instalado </p>
<p>In order to view the photo gallery, you need JavaScript activated and at least flash player 9 installed!</p>
</div>

</div>
</div>

<div id="content4" class="scrolling-content">
<h1 id="hcont">CONTACTO</h1>
<div id="contact1">
<h3>&iquest; Tienes alguna pregunta?</h3>
<p>No lo dudes y ponte en contacto con nosotros. <br/>Puedes hacerlo
llamando al Tel.: <b> 605 98 72 96</b>,<br />
enviando un mail a <b>[email protected]</b>,<br />
o completando nuestro formulario:<br /> </p>
<a id="contac" href="javascript:ModalPopupsCustom1();">Formulario de Contacto </a>
</div>
<div id="facebook">


<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="http://www.facebook.com/pages/Bikubika-Dise%C3%B1o-Web-Infograf%C3%ADa-Multimedia/167455046645334" send="true" width="300" show_faces="false" colorscheme="light" font="arial" font-color="black"></fb:like>


</div>

</div>

<div id="formulario">
<script>

function ModalPopupsCustom1() {
ModalPopups.Custom("idCustom1",
"<legend>Formulario de Contacto</legend>",
"<fieldset>" +
"<form id='formulario1' name='formulario1' method='post' action='submit2.php' onSubmit='ModalPopups.Close('idCustom1')'>" +
"<table>" +
"<tr><td><label for='name'>Nombre</label></td>" +
"<td><input type=text id='inputCustom1Name' name='inputCustom1Name'style='width:200px;'></td></tr>" +
"<tr><td><label for='email'>Email</label></td>" +
"<td><input type=text id='inputCustom1Email' name='inputCustom1Email' style='width:200px;'></td></tr>" +
"<tr><td><label for='phone'>Teléfono</label></td>" +
"<td><input type=text id='inputCustom1Phone' name='inputCustom1Phone' style='width:100px;'></td></tr>" +
"<tr><td><label for='question'>Asunto</label></td>" +
"<td><input type=text id='inputCustom1Question' name='inputCustom1Question' style='width:200px;'></td></tr>" +
"<tr><td><label for='text'>Cuéntame</label></td>" +
"<td><input type=text id='inputCustom1Text' name='inputCustom1Text' style='width:200px;'></td></tr>" +
"</table>" +
"</fieldset>" +
"</form>",


{
width: 400,
buttons: "ok,cancel",
okButtonText: "enviar",
cancelButtonText: "cancelar",
onOk: "ModalPopupsCustom1Save()",
onCancel: "ModalPopupsCustom1Cancel()"
}
);



ModalPopups.GetCustomControl("inputCustom1Name").focus();
}

function ModalPopupsCustom1Save() {
var custom1Name = ModalPopups.GetCustomControl("inputCustom1Name");
if(custom1Name.value == "")
{
alert("Rellena los campos vacios");
custom1Name.focus();
}
else
{

alert("Gracias por contactar con nosotros" );
enviar_formulario();

}
}

function ModalPopupsCustom1Cancel() {
alert('¿Quieres cancelar?');
ModalPopups.Cancel("idCustom1");
}

</script>




Este seria el php de envio;

<?php
$name=$_REQUEST['inputCustom1Name'];
$email=$_REQUEST['inputCustom1Email'];
$phone=$_REQUEST['inputCustom1Phone'];
$question=$_REQUEST['inputCustom1Question'];
$text=$_REQUEST['inputCustom1Text'];


$mensaje="name:$name - email:$email - phone:$phone - question:$quetion - text:$text";

mail("[email protected]","Correo desde Web", $mensaje);


?>

y este es el código de envio con ajax que he encontrado en la web:



$('dos').addEvent('click', function(ev)
{
new Event(ev).stop();
var miAjax = new Ajax('recibe.php',
{
method: 'get',
data:$('form1'),
update: $('respuesta2')
});
miAjax.request();
});


con su php:

<?php
//recibe.php
echo '<strong>Estas son las variables que recibe PHP:</strong> <br/>';
foreach($_GET as $llave => $valor)
echo $llave . ' = ' . $valor . '<br/>';
?>




Uffffff, mucho código hay aqui.....
ahora lo que no se es como hago para modificar el código ajax y adaptarlo a mi web.

Esto es mucho pedir pero esstoy mu perdida, ya que al no entender como funciona ajax no puedo entender como tendria que modificarlo.

Muchas gracias por la respuesta.