how to treat div as submit button

[raf.fredi]

How to submit content of textarea when clicked on Share Div?

<div class="status">
    <textarea class="input" name="status" id="content" >
        So whats on your mind?
    </textarea>
</div>

<div class="button_outside" id="share">
    <div class="button_inside">Share</div>
</div>

[urtrivedi]

Just treat it as a button, use onclick event to do whatever you want

<div class="status">
    <textarea class="input" name="status" id="content" >
        So whats on your mind?
    </textarea>
</div>

<div class="button_outside" id="share" onclick="javascript:alert('hi')">
    <div class="button_inside">Share</div>
</div>

[raf.fredi]

How to use jquery for this purpose?

Just treat it as a button, use onclick event to do whatever you want

<div class="status">
    <textarea class="input" name="status" id="content" >
        So whats on your mind?
    </textarea>
</div>

<div class="button_outside" id="share" onclick="javascript:alert('hi')">
    <div class="button_inside">Share</div>
</div>

[urtrivedi]

Just think that its not div but its a button. If you find code for button, same way you write code for share id.

[raf.fredi]

This is my function which results empty 'status'

<script type="text/javascript">
$(document).ready(function(){
 
	$('#share').click(function(){
		var DATA = 'status=' + status;
		alert (DATA);
		$.ajax({
		type: "POST",
		url: "insert.php",
		data: DATA,
		success: function() {
		  //display message back to user here
		}
	  });
	  return false;
	  
		
		
	});
	
});
</script>

Just think that its not div but its a button. If you find code for button, same way you write code for share id.

[urtrivedi]

there may be problem with insert.php, because alert is working fine when you click on share div.

[raf.fredi]

This is my final function .

<script type="text/javascript">
$(document).ready(function(){	
	$('#share').click(function(){		
		var status=$(".input").val();
 		var DATA = 'status=' + status;
		$.ajax({
		type: "POST",
		url: "insert.php",
		data: DATA,
		success: function() {
		  //display message back to user here
		}
	  });
	  return false;	
	});
});
</script>

How to add following

if(status == "So what's on your mind?")
  { //do nothing}
else
  {//insert values  
  }

there may be problem with insert.php, because alert is working fine when you click on share div.

[urtrivedi]

Try this I hope it will work

<script type="text/javascript">
$(document).ready(function(){	
	$('#share').click(function(){		
            var status=$(".input").val();
	    if(status!="So what's on your mind?")	
            {
 		var DATA = 'status=' + status;
		$.ajax({
		type: "POST",
		url: "insert.php",
		data: DATA,
		success: function() {
		  //display message back to user here
		}
            }
	  });
	  return false;	
	});
});
</script>

[raf.fredi]

Thanks but not working. It does not insert anything to database.

Try this I hope it will work

<script type="text/javascript">
$(document).ready(function(){	
	$('#share').click(function(){		
            var status=$(".input").val();
	    if(status!="So what's on your mind?")	
            {
 		var DATA = 'status=' + status;
		$.ajax({
		type: "POST",
		url: "insert.php",
		data: DATA,
		success: function() {
		  //display message back to user here
		}
            }
	  });
	  return false;	
	});
});
</script>

[urtrivedi]

Thats what I told you in my previous post, its not jquery fault, You need to review your insert.php page. Make sure it works fine independently.

[pzuurveen]

trie

<div class="button_outside" id="share" onclick="javascript: document.forms["myform"].submit();">
    <div class="button_inside">Share</div>
</div>

[raf.fredi]

Final Function is well without if else. When if else is added it works badly either it inserts "So what's on your mind?" or it stops working like your function.

Thats what I told you in my previous post, its not jquery fault, You need to review your insert.php page. Make sure it works fine independently.

Your textbox is showing:

So whats on your mind?

You're testing for

So what's on your mind?

Notice the apostrophe?

Anyway, I don't know if this is the best way to do it. You'd probably be better off if you detect a change to the textarea (dirty form) - rather than it being a certain value. This means you don't have to change the code if you decide to change the default value in the textarea.

have a look at this: http://stackoverflow.com/questions/2829881/detecting-html-textareas-change