Disallowed Key Characters - Jquery och CodeIgniter

[Mycodez]

Hallo på er.

Jag sitter och pillar på en site här och jag håller ivrigt på att lära mig detta med javascript och Jquery.

Nu har jag dock fastnat.

Jag testar lite i dagsläget.

HTML

<form id="comment" method="post">
<label>Name: </label><input type="text" id="name" name="name"/><br />
<label>&nbsp;</label><input type="submit" value="Submit" />
</form>

JQueryn

$(function(){
	$("#comment").submit(function(){
 
		$.ajax({
			type: "POST",
			url: "<?php echo base_url(); ?>user/post_action",
			data: $('#comment').serialize(),
 
			success: function(data){
						alert('Successful! - '+data);
					}
		});
 
	return false;  //stop the actual form post !important!

	});
});

och php functionen

function post_action()
	{
		//echo "<pre>",print_r($_POST),"</pre>";   
	    if($_POST['name'] == "")
	    {
	        $message = "You can't send empty text";
			return $message;
			//return FALSE;
	    }
	    else
	    {
	        $message = $_POST['name'];
			return $message;
			//return TRUE;
	    }
	    //echo $message;
	}

Det jag får från alertn är
Successful! - Disallowed Key Characters.

Hur kan jag göra så jag får bort Disallowed Key Characters. Jag läste lite och testade med någon escape function, men då fick jag samma resultat med %20 och så ^^

Hur ska jag gå tillväga och så?

[voigtann1]

kommer post_action retunera en vy av något slag? det räcker ju inte bara att retunera ett php värde?

om jag hade skrivit koden så hade jag nog gjort:
[kod]<form id="comment" method="post" action="<?php echo base_url(); ?>user/post_action">
<label>Name: </label><input type="text" id="name" name="name"/><br />
<label>&nbsp;</label><input type="submit" value="Submit" />
</form>[/kod]

och js koden:
[kod]$(function(){
$("#comment").submit(function(e){
e.preventDefault();
$.aja{
type: this.method || get,
url: this.action,
data: $(this).serialize(),
success: function(data){
alert('Successful! - ' + data);
}
});
});
});[/kod]gillar inte att man skriver PHP i js koder.

[Mycodez]

Det kommer gå till en blivande by kan man säga, det jag ska använda det till är det finns två olika typer av knappar, en som man lägger till data i databasen, sen den andra är att man kan redigera den lagrade datan.
Jag kör med CI med en egen anpassad version av bootstrap. Alltså detta med att redigera och skapa data kommer att ske via en modal som kommer bli en vy om det går att fixa som kommer upp när man trycker på några av knapparna ^^ hoppas ni förstår ^^

[voigtann1]

Om du menar Twitter bootstrap så spelar det ingen roll, är inte en JS problem utan ett CI problem, du behöver retunera någon typ av innehåll som text/json/html som man kan hämta upp.


Disallowed Key Characters verka vara för att det bli ett get anrop, är du säker på att man inte skall ha [kod]<?php echo base_url(); ?>user/post_action/[/kod] istället för [kod]<?php echo base_url(); ?>user/post_action[/kod]jag fick en get redirect igår på binero när jag körde <?php echo base_url(); ?>user/post_action men <?php echo base_url(); ?>user/post_action/ fungera

[Mycodez]

Det fungerade om jag kör en echo i php funktionen då fungerade det som jag vill efter din JS kod. Men detta med serialize() vad är det denna gör egentligen har inte fått ett riktigt grepp om den funktionen än

[voigtann1]

räcker att du läser dokumentationen: http://api.jquery.com/serialize/ tycker det är rätt bra förklarat.

[Mycodez]

Jag fixat så det bara är så här nu. Det jag vill är att jag öppnar min modal

HTMLen jag kör med nu ser ut:

<form id="comment" method="post" action="<?php echo base_url(); ?>user/post_action">
	<label>&nbsp;</label><input type="submit" value="Regigera" />
</form>

och php funktionen ser ut såhär

if ($this->input->is_ajax_request())
{
    $this->load->view('some/view_modal');
}
else 
{
    $this->load->view('login'); //bara exempel Ändra till något.
}

och modalen jag vill öppna ser ut såhär

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
          <h4 class="modal-title">Modal title</h4>
        </div>
        <div class="modal-body">
          ...
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          <button type="button" class="btn btn-primary">Save changes</button>
        </div>
      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
  </div><!-- /.modal -->

hur får jag nu själva Jquery coden att öppna denna modal?

$(function(){
	$("#comment").submit(function(e){
		e.preventDefault();
		$.ajax({
			type: this.method || get,
			url: this.action,
			data: $(this).serialize(),
			success: function(data){
				alert('Successful! - ' + data);
			}
		});
	});
});

[Mycodez]

räcker att du läser dokumentationen: http://api.jquery.com/serialize/ tycker det är rätt bra förklarat.

Det var det visst. Men nu bara hur löser jag mitt nuvarande problem^^

[Mycodez]

Kom på en alternativ lösning det är att jag loppar ut de olika resultaten på sidan där jag vill ha modalen så kan jag använda jquery för att ta hand om errors och så. Kan ju testa lite smått ^^

[voigtann1]

du retunera väl html i din ajax response. lägg in den i din DOM struktur?

[Mycodez]

hur gör man det?

Jag har suttit och kollat på en alternativ lösning om göra som jag vill, men något jag vill att detta ska göra är om det blir fel från PHP sidan så vill jag vara kvar i modal fönstret sen få alla fel utskrivna, om det blir blir rätt så vill jag att man är kvar i tex 5 sekunder sen försvinner modalen? förstår ni?

Det jag kodat nu är att alla får sin unika modal redan vid utloopningen av datan och det funkar bra.

Min modal ser nu ut såhär

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
          <h4 class="modal-title">Modal title</h4>
        </div>
        <div class="modal-body">
          <?php
			$attributes = array('class' => 'myform', 'id' => 'foo');
    		echo form_open('user/test', $attributes);
			?>
			<label for="bar">A bar</label>
    		<input id="bar" name="bar" type="text" value="" />
			<input type="submit" value="Send" />
			<?=form_close()?>
			<!-- The result of the search will be rendered inside this div -->
			<div id="result"></div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          <button type="button" class="btn btn-primary">Save changes</button>
        </div>
      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
  </div><!-- /.modal -->

js koden

/* Attach a submit handler to the form */
$("#foo").submit(function(event) {

    /* Stop form from submitting normally */
    event.preventDefault();

    /* Clear result div*/
    $("#result").html('');

    /* Get some values from elements on the page: */
    var values = $(this).serialize();

    /* Send the data using post and put the results in a div */
    $.ajax({
        type: this.method || get,
		url: this.action,
        data: values,
        success: function(data){
            alert("success");
            $("#result").html('Submitted successfully'+data);
        },
        error:function(){
            alert("failure");
            $("#result").html('There is error while submit');
        }
    });
});

och php funktionen ser ut

function test(){
		if(isset($_POST['bar'])=== true && empty($_POST['bar']) === FALSE){
			$var = "".$_POST['bar'];
		}else{
			$var = "You havent post something.";
		}
		echo $var;
	}

Hur går jag tillväga här i från?

[voigtann1]

Jag har suttit och kollat på en alternativ lösning om göra som jag vill, men något jag vill att detta ska göra är om det blir fel från PHP sidan så vill jag vara kvar i modal fönstret sen få alla fel utskrivna, om det blir blir rätt så vill jag att man är kvar i tex 5 sekunder sen försvinner modalen? förstår ni?

Förmodligen missförstå jag dig men du har modal boxen redan synlig och om man inte få ett fel ifrån ajax koden så skall den döljas? skicka du ett fel om värderna inte är satta eller? test() ser ut som retunera ett OK eller en sträng.

error i ajax anropet är om det bli 404, 500 fel ifrån servern.

så i din success om den retunera något annat än "You havent post something" så skall man anse att det är OK annars ett fel? då få du ju kolla på data att värdet inte är "You havent post something" och dölja efter 5 sekunder

[Mycodez]

Precis min modal är redan uppe i detta läge. Ja men annars går det att från test() returnera true om det är rätt eller returna en sträng med fel? isåfall hur gör man det är det json man ska köra då?

om nu return blir true hur gör jag då att modalen försvinner?

[voigtann1]

Om du nu använder dig av twitter bootstrap så kan du väl köra deras API för att dölja modal boxen:

http://getbootstrap.com/javascript/#modals

och i din success så få du väl se om [kod]if(data === true) {
$("din_modal").modal('hide')
} else {
// vad du vill göra när det inte är true
}[/kod]

[Mycodez]

Kanon tack

Men gör man om man detta.

Jag kollar nu, två olika värden i en array jag returnar från PHP som ja kör Json_encode() på

array kan se ut så här

Array(
'result' => 'ture/false',
error => Array('kort text','upptaget')
)

nu vill jag att result om det är false vilkejt jag redan kollar ska loopa ut error hur kan jag göra det. till <ul><li><li></ul> ?
Annars har jag faktiskt fått kläm på detta