Jquery Onclick Change hidden parameter and submit - php

Hi i'm using php and jquery. I have create dinamically a list of a div like that
<div class="divclass" id="<?php echo $i-1;?>">
<a href=" <?php echo $this->url(array('controller'=>'controller name','action'=>'action name'));?>">
<span>Date: </span>
</a>
</div>
My javasctipt script is, i pick the name of the id clicked, i set the hidden parameter to the name of the id and i want to submit the form
<script type="text/javascript">
$(document).ready(function() {
$('.divclass').click(function(){
var idarray = $(this).attr("id");
document.getElementById('testo').value=idarray;
document.forms["prova"].submit();
});
});
The form is:
<form id="prova" method="post" action="<?php echo Zend_Controller_Front::getInstance()->getBaseUrl().'/controller-name/action-name';?>">
<input type="hidden" value="" id="testo">
</form>
</script>
But in the next page i don't have the post parameter.

You need to give name attribute to #testo and then try this:
e.g
<input type="hidden" value="" id="testo" name="testo">
Your form is within <script> tag, Place it outside of <script> tag.
and write following code within DOM ready like follwing:
<script type="text/javascript">
$(function() {
// after DOM ready
$('.divclass').click(function(){
var idarray = $(this).attr("id"); // or this.id do the same thing
$('#testo').val(idarray); // set value to testo
$("form#prova").submit(); // submit the form
});
});
</script>

Related

How to handle multiple requests with the help of one function in AJAX?

view
<?php
for(condition)
{
?>
<input type="hidden" name="pid" value="<?php echo $data1->id; ?>">
</i>
<?php
}
?>
AJAX
<script type="text/javascript">
$ (document) .ready(function() {
$('[name="like"]') .click (function() {
var pid = $('[name="pid"]').val();
alert(pid);
});
});
</script>
Expected Result:-
If I click on like anchor tag it should show me different id for different posts and I don't want to reload my page.
Actual Result:-
It is showing me the first id when I click on different like tags of different posts.
I am new to AJAX.
Thanks in advance.
view
<?php
for($i=0;$i<count($data1);$i++)
{
?>
<input type="hidden" name="pid#<?=$i?>" value="<?php echo $data1->id; ?>">
</i>
<?php
}
?>
AJAX
<script type="text/javascript">
$ (document) .ready(function() {
$('[name="like"]') .click (function() {
$name = $(this).split("#");
var pid = $('pid'+$name[1]).val();
alert(pid);
});
});
</script>
you place the input and a inside the div and then get the a's sibling which is the input
<?php
for (condition) {
?>
<div>
//Your input and a tag here
</div>
<?php }
?>
<script>
$('[name="like"]').click(function () {
var input = $($(this).siblings("input")[0]); // get the input element
var value = input.val(); //value of the input
alert(value);
});
</script>
You are setting same name for all the input.
If you don't need input field as hidden then you can use attribute to set and get the value of your post.
<?php
for(condition)
{
?>
<input type="hidden" name="pid" value="<?php echo $data1->id; ?>">
</i>
<?php
}
?>
You can use class name to access the attribute of anchor tag.
<script type="text/javascript">
$(document).on('click', '.select_id', function(){
var pid = $(this).attr('data-pid');
alert(pid);
});
</script>

$_POST for text in DIV elements

Because of my web style, i don't want to use input & textarea and get information by using $_POST[] and i need to get information that is in DIV element.
For example , I want to get information in this :
<div class="mine" name"myname">
this is information that i want to get and put into database by PHP !
</div>
and :
$_POST[myname];
But i can't do it with $_POST , How can i do it ??
And if this method can't do this , do you know any other method to get information from DIV like this ?
you can call a onsubmit function and make a hidden field at the time of form submission like this
HTML
need to give a id to your form id="my_form"
<form action="submit.php" method="post" id="my_form">
<div class="mine" name"myname">
this is information that i want to get and put into database by PHP !
</div>
<input type="submit" value="submit" name="submit" />
</form>
Jquery call on submit the form
$(document).ready(function(){
$("#my_form").on("submit", function () {
var hvalue = $('.mine').text();
$(this).append("<input type='hidden' name='myname' value=' " + hvalue + " '/>");
});
});
PHP : submit.php
echo $_POST['myname'];
You can use this method. First, with javascript get content of <div>
Code:
<script type="text/javascript">
var MyDiv1 = Document.getElementById('DIV1');
</script>
<body>
<div id="DIV1">
//Some content goes here.
</div>
</body>
And with ajax send this var to page with get or post method.
You would need some JavaScript to make that work, e.g. using jQuery:
$.post('http://example.org/script.php', {
myname: $('.mine').text()
});
It submits text found inside your <div> to a script of your choosing.
You can use following structure;
JS:
$(document).ready(function() {
$("#send").on("click", function() {
$.ajax({
url: "your_url",
method: "POST",
data: "myname=" + $(".mine").text(),
success: function(response) {
//handle response
}
})
})
})
HTML:
<div class="mine" name"myname">
this is information that i want to get and put into database by PHP !
</div>
<input type="button" name="send" id="send" value="Send"/>
You can see a simulation here: http://jsfiddle.net/cubuzoa/2scaJ/
Do this in jquery
$('.mine').text();
and post data using ajax.
Put the content of DIV in a variable like below:
var x = document.getElementById('idname').innerHTML;

trying to auto submit form after text input

Here is how the form is supposed to execute:
<script>
$(document).ready(function(){
$("#submit").click(function(){
//access token stuff
var token = $("#link_input").val(); ... etc</script>
.
I am trying to auto submit this info once it exceeds 10 characters. Normally you fill out the text area in the input field and you click submit. Upon clicking the submit button the JS validates the text in the input box and if it's valid it executes. How can I auto-submit the text in the input box without having to click the submit button?
<script language="JavaScript" type="text/JavaScript">
var x=10;//nr characters
function submitT(t,f){
if(t.value.length==x){
f.submit()
}
}
</script>
<input id="link_input" onkeyup="submitT(this,this.form)" autofocus="true" autocomplete="off" placeholder="http://www.facebook.com/connect/login_success.html#access_token=AAAZDCiOS6Ls0BAMUKJDvLZCTgZDZD" style="width: 600px;margin-left: -11%;" value="" name="url">
<br/>
<div id="Wait" style="display:none;"><center>Processing your form<br><img src="http://i.imgur.com/kKqSe.gif"></center></div>
<br/>
<center>
<img src="http://i.imgur.com/eA6fv.png" style="border:0px;padding-top:5px;">
$('#link_input').on('keyup', function() {
if($(this).val().length > 10) {
$('form').submit();
}
});
Just test against keyup similar to what you have already.
<form action='someplace' id='myform' method='post'>
<input type='text' id='link_input' ...other stuff />
</form>
jquery:
$('#link_input').on('keyup',function(){
var val = $(this).val();
var len = val.length;
if(len == 10){
$('#myform').submit();
}
});
Rename your btn from submit to btnSubmit.
The id of submit is going to mess with f.submit()

Jquery Ajax selectors

Im trying to make something like this http://demos.99points.info/facebook_wallpost_system/ which is a comment system. I have the ajax code below except i don't know how to uniqely select textareas. The challenge is that the number of posts is variable so all of the posts need to be uniquely identified so that when the data is put into the database i know which post it relates to.
JQUERY:
<script type='text/javascript'>
$('document').ready(function(){
$('.commentContainer').load('../writecomment.php');
//commentContainer is a class so it applies to all of the textareas, but i need this selector to be unique
$('.submitCommentBox').click(function(){
//these are the selectors that i can't get to work right
var comment = $('').val();
var postid = $('').val();
$.post('../comment.php',
{
comment: comment,
postid: postid,
},
function(response){
$('#commentContainer').load('../writecomment.php');
$('.commentBox').val('');
}
}
return false;
}):
});
</script>
HTML/PHP
<?php while ($row=mysql_fetch_assoc($query)){
echo"
<p name='singlePost'>$post[$f]</p>
<div id='commentContainer'></div>
<textarea class='commentBox'></textarea>
<input type='button' value='submit' class='submitCommentBox'>";
}
basically the HTML/PHP generates for each post on the page as to create a textarea and subimt button for each post. therefore the user can comment on each post.
Using the markup in the link you provided, I would do something like:
var container = $(this).closest('.friends_area');
var comment = $(container).find('.commentbox').val();
var questionid = $(container).find('#hidden').val();
var answerid = $(container).find('').val();
A more correct solution would be something like:
HTML
<div id="posting">
<form method="post" action="">
<input type="hidden" name="record_id" value="123" />
<textarea name="comment"></textarea>
<button type="submit">Comment</button>
</form>
...
</div>
JS
$('#posting').on('submit', 'form', function(e) {
e.preventDefault();
var form = $(this).closest('form');
$.post($(form).attr('action'), $(form).serialize(), function() {
$('#commentContainer').load('../writecomment.php');
$('.commentBox').val('');
});
});

How to send a form after a click

I have this code :
<script type="text/javascript">
$(document).ready(function() {
$('a[name=linkArtist]').click(function(e) {
e.preventDefault();
$('#changeArtist').val($(this).attr('title'));
});
});
</script>
<form action="index.php?explore=browse" method="post">
<input type="hidden" id="changeArtist" name="artist" value="<?=$artist?>" />
<a name="linkArtist" title="a" href="#">A</a> -
<a name="linkArtist" title="b" href="#">B</a> -
<a name="linkArtist" title="c" href="#">C</a>
</form>
When I click on the button, I set the link value (as 'title') to the hidden field, and after I'd like to send that form! How can I do it? And what do you think about this code? Can I better it?
JavaScript:
<script type="text/javascript">
$(document).ready(function() {
$('a[name=linkArtist]').click(function(e) {
e.preventDefault();
$('#changeArtist').val($(this).attr('title'));
$('#myForm').submit();
});
});
</script>
The form:
<form action="index.php?explore=browse" method="post" id="myForm">
Note the form id and the change to the click handler to access it.
I don't think you need to use preventDefault() at all. The form should not submit until the function has returned.

Categories