# Submit Button mit Link ausführen?



## tsbmusic (27. August 2010)

Hi Leute,

ich hab auf einer Website gesehen, dass man auch Submit-Buttons mit Links ausführen kann. (http://www.bonjovi.com)

Der Code sieht da so aus:


```
<input type="submit" value="Submit" name="submit" class="action save">
<a href="#submit" class="action submit" style="visibility: visible;">Submit</a>
```

Ich find aber keine Javascript Angabe dazu. Könnt ihr mir helfen wie man das macht?

Gruss
tsbmusic


----------



## Parantatatam (27. August 2010)

Das ist durch jQuery möglich. Auf der Seite wird es irgendwo eine Anweisung geben, die in etwa so aussieht:

```
$('.action submit').click(function () {
  $('.action save').submit();
});
```


----------



## tsbmusic (27. August 2010)

Und das schreib ich einfach so oder?


```
<script type="text/javascript">
$('.action submit').click(function () {
  $('.action save').submit();
});
</script>
```

Oder muss ich das noch in eine function setzten?

Edit: Ich habs jetzt mal so ausprobiert es funktioniert aber nicht. Das Formular wird nicht abgesendet. Muss ich das an irgendeine bestimmte Stelle setzen?


----------



## matth-ee (27. August 2010)

Hi!

Also mit jQuery gehts grundsätzlich so, wenn sich der <script>-tag im <head>-bereich der html-seite befindet:


```
<script>
$(document).ready(function(){ // Sobald der Browser das laden beendet hat mache...
   $(".submit").click(function(){ // Finde HTML-Objekte mit der Klasse "save"
      $(".form").submit();           // Führe ein Submit auf einem Objekt mit der Klasse "form" aus
   }
});
</script>
```

Das dazugehörige Html-Formular sollte dann ähnlich wie dieses aufgebaut sein:


```
<form action='script.php' name='form1' class='form'>
<input>
<input>
...
<input type="submit" value="Submit">
</form>

<a href='#' class='submit'>abschicken</a>
```

Noch ein paar Ergänzungen:


Wenn dein jQuery-Selector folgendermaßen aussieht:


```
$('.action save')
```
, dann würdest du in deinem Fall keine Objekte zur Weiterverarbeitung auswählen. Übersetzt würde nämlich deine Anweisung bedeuten: "Finde alle Objekte mit der Klasse "action" und selektiere in den Unterobjekten alle <save>-Tags."
Die dazugehörige HTML-Struktur würde beispielsweise so aussehen:

```
<span class='action'>
<save>ich würde selektiert werden</save>
</span>
```
Da dies aber nicht auf deinen HTML-Code zutrifft, würde jQuery natürlich, wenn überhaupt, die falschen Objekte auswählen.



 Für solch einfachen Aufgaben jQuery zu verwenden, ist natürlich etwas übertrieben. Mit JavaScript kann man nämlich einfache Funktionen direkt im Link ausführen:


```
<a href="javascript:document.form1.submit();">abschicken</a>
```
Wichtig bei dieser Variante ist, dass man beim <form>-Tag das Attribut "name" auf "form1" setzt.

```
<form name='form1'>...</form>
```
Selbstverständlich kann dieser frei gewählt werden, wichtig ist aber, dass er mit mit dem im <a href> verwendeten Namen übereinstimmt.



Ich hoffe ich hab dich mit meiner Text-Flut nicht erschlagen 

Beste Grüße!


----------



## tsbmusic (27. August 2010)

Ich hab auf der Bon Jovi Seite noch folgendes gefunden: 

jquery-actions.js

```
/* CLIQUE */
/* Actions Pattern Javascript
----------------------------------------------------------------------------- */


	(function($) {
	
	$.fn.cliqueActions = function() {
	
	
/* PRESERVE CHAINING
----------------------------------------------------------------------------- */


		return this.each(function(index) {

			var $this = $(this);
	
/* REPLACE BUTTONS
----------------------------------------------------------------------------- */

			
			if ($this.attr('value') && $this.attr('value') != "Submit") {
			
				var language = $this.attr('value');
			
			} else if ($this.parent().parent().parent().hasClass('signin')) {
			
				var language = "Sign In";
				
			} else if ($this.parent().parent().parent().hasClass('password')) {
			
				var language = "Reset Password";
			
			} else {
			
				var language = "Submit";
			
			}
			
			$this.parent().addClass('submit');			
			$this.after('<a class="action submit" href="#submit">' + language + '</a>');
		

/* SUBMIT FORM
----------------------------------------------------------------------------- */
	
	
			$('a.action.submit').click(function() {
	
				$(this).siblings('input[type=submit]').click();

				// DISABLE SUBMIT ORDER BUTTON AFTER CLICK
				if ($(this).parent().hasClass('emphasis')) $(this).unbind('click').click(function() { return false; });
				
				return false;
				
			});
	
	
/* END PLUG-IN
----------------------------------------------------------------------------- */


		});
	};
	})(jQuery);
```


----------



## Sven Mintel (28. August 2010)

<ot>Bon Jovi...igitt,

sorry, dat musste jetzt  sein 
</ot>


----------



## tsbmusic (28. August 2010)

Woanders hab das noch nicht gesehen...


----------

