PHP jQuery AJAX Request - Method POST

[Cr41s3]

Hallo zusammen.

Ich würde aktuell gerne bei einem Button Klick, dass die Value von dem Button per POST an die selbe PHP Datei geschickt wird.

So sieht mein Code bisher aus:

<button class="delete" name="delete" value="'.$result['id'].'"><span class="glyphicon glyphicon-trash"></span> Delete</button>

^Das funktioniert so weit.
Nur noch eine Frage zu dem Button, wenn ich den Button zu einem Bootstrap Button machen will muss ich ja die class ändern, aber ich kann nur den class Namen per javascript prüfen.
Geht das auch anders?

<script>

$(document).ready(function() {
    $(".delete").click(function() { post_delete(); });
});

function post_delete()
{
    jQuery.ajax({
        type: "POST",
        url: 'index.php?page=news',
        data: {delete: [$(".delete").val()]},
         success:function(data) {
        alert(data);
         }
    });
}
</script>

^alert(data) gibt mir komischerweise immer den HTML Seiten Code zurück.

Und zum Testen, ob was ankommt:

if( isset($_POST['delete']) && is_numeric(($_POST['delete'])))
			{
				$deleteid = $_POST['delete'];
				header("Location: http://google.de");
			}

Hoffe ich könnt mir helfen.

MfG-

 

[Fireball89]

In Zeile 12 hast du $(".delete").val() in ein Array gepackt. Warum?
Wenn du die Array-Klammern entfernst, müsste "is_numeric($_POST['delete'])" true ergeben.

 

[xSeppelx]

Schau dir Mal die ganzen anderen Selektoren an, ggf. eine ID nehmen zum selektieren.

 

[Tumbleweed]

Ein HTML-Element darf mehrere Klassen haben, daher wirst du da kein Problem haben, wenn du Bootstrap-Klassen hinzufügst.

Zu Selektoren: http://www.w3schools.com/css/css_attribute_selectors.asp

Sowas wie button[name="delete"] dürfte in deinem Fall gut passen.

Um auf einen Redirect zu reagieren: http://stackoverflow.com/questions/199099/how-to-manage-a-redirect-request-after-a-jquery-ajax-call

 

[Cr41s3]

Habe das Script nun so abgeändert:

<script>

$(document).ready(function() {
    $(".delete").click(function() { post_delete(); });
});

function post_delete()
{
    jQuery.ajax({
        type: "POST",
        url: 'index.php?page=news',
        data: 'delete: $(".delete").val()',
         success:function(data) {
        alert($(".delete").val());
         }
    });
}
</script>

Der Button geht nun auch.
Bekomme als Alert auch die richtige value zurück.

 

[John Reese]

Mehrere Dinge:

1.: Ich würde das so schreiben:

<script>
	$(function() {
		$(".delete").on("click", function(e) {
			e.preventDefault(); // verhindere abschicken des Buttons
			$.ajax("index.php?page=news", {
				"delete": $(".delete").val() // hier macht eine ID mehr Sinn?!
			}).on("success", function(response) {
				// mach hier was du willst
				alert($(".delete").val());
			});
		});
	});
</script>

data: 'delete: $(".delete").val()',

So schickt er immer diesen String zu deinem PHP-Skript, was garantiert nicht das ist, was du willst.
Ich würde ein Objekt nehmen, aber wenn's unbedingt ein String sein soll, dann nur

$(".delete").val()

 

[Cr41s3]

@CryNickSystems , da ich noch so gut, wie keine Ahnung von AJAX habe, wäre es schön, wenn du das ganze etwas mehr erklären könntest.
Und bei deinem Script funktioniert der Alert schon mal nicht.+

Habe es nun folgendermaßen zum Laufen gebracht dank EURER Hilfe

<script>
	$(function() {
		$(".delete").on("click", function(e) {
			e.preventDefault(); // verhindere abschicken des Buttons
			$.ajax({
				type: "POST",
				url: "index.php?page=news",
				data: {delete:$(".delete").val()}
			})
			.on("success", function(response) {
				// mach hier was du willst
				alert($(".delete").val());
			});
		});
	});
</script>

Nur gibt er mir kein Success zurück, aber egal.

 

[John Reese]

Mein Fehler xD
Man kommt aber auch schnell durcheinander.

So muss es natürlich lauten:

<script>
	$(function() {
		$(".delete").on("click", function(e) {
			e.preventDefault(); // verhindere abschicken des Buttons
			$.ajax("index.php?page=news", {
				"delete": $(".delete").val() // hier macht eine ID mehr Sinn?!
			}).done(function(response) {
				// mach hier was du willst
				alert($(".delete").val());
			});
		});
	});
</script>

Das ist alles was du brauchst:
http://api.jquery.com/jquery.post/

 

[Cr41s3]

Okey danke dir.

 

[Daaron]

Warum versuchst du innerhalb der Click-Function noch einmal mit $('.delete') das Element zu bestimmen? Du (bzw. die Click-Function) kennt das geklickte Element doch bereits. "this" heißt das Zauberwort.

$('.ein .selector').click(function(){
console.log(this);
});

Probiers aus...

...und Test-Ausgaben macht man nicht mti alert, sondern mit console.log();

 

[Cr41s3]

Okey danke.

So oder wie?

data: {delete:this.val()}

Bei done function... geht das mit this nur bei dem date Feld nicht.

 

[Daaron]

$(this).val()

Das ist ne Eigenheit von jQuery... "this" ist jeweils nur ein reguläres DOM-Element, ohne die jQuery-Umhüllung. Du könntest also wohl auch this.value sagen (ohne ()). Wenn du val() verwenden willst, musst du aus "this" eben erst ein jQ-Element machen... mit $()

Bei dem anderen großen und beliebten Framework, Mootools, wird mehr oder weniger alles permanent in ein MT-Element verwandelt.

 

[Cr41s3]

Okey danke, dann wäre hier alles geklärt.