QA@IT
«回答へ戻る

再修正

60
 ```javascript
 $("form").submit(function() {
   // 当該 form 配下の input タグにバインドされた preSubmit イベントを起動
-  $(this).find(":input").trigger("preSubmit", [this]);
-      var preSubmitEvent = jQuery.Event("preSubmit");
-      $(this).find(":input").trigger(preSubmitEvent, [this]);
-      if (!preSubmitEvent.reault) {
-        return false;
-      }
+  var preSubmitEvent = jQuery.Event("preSubmit");
+  $(this).find(":input").trigger(preSubmitEvent, [this]);
+  if (!preSubmitEvent.reault) {
+    return false;
+  }
 });
 
 $("input#email").bind("preSubmit", function(e, formElement) {

汎用的に、ということであれば jQuery のカスタムイベントを使ってみてはいかがでしょうか。

submit のときにゴニョゴニョとしたい部分をイベントとして分離することで、コードのセマンティクスとしてはだいぶスッキリするかと思います。

JavaScript

$("form").submit(function() {
  // 当該 form 配下の input タグにバインドされた preSubmit イベントを起動
  var preSubmitEvent = jQuery.Event("preSubmit");
  $(this).find(":input").trigger(preSubmitEvent, [this]);
  if (!preSubmitEvent.reault) {
    return false;
  }
});

$("input#email").bind("preSubmit", function(e, formElement) {
  window.location.href = "/foo/" + this.value;
  return false;
});

$("form").submit(...); の部分を共通の JavaScript に切り出しておけば標準的に preSubmit イベントが利用できるような形になりますね。

汎用的に、ということであれば jQuery のカスタムイベントを使ってみてはいかがでしょうか。

submit のときにゴニョゴニョとしたい部分をイベントとして分離することで、コードのセマンティクスとしてはだいぶスッキリするかと思います。

#### JavaScript 

```javascript
$("form").submit(function() {
  // 当該 form 配下の input タグにバインドされた preSubmit イベントを起動
  var preSubmitEvent = jQuery.Event("preSubmit");
  $(this).find(":input").trigger(preSubmitEvent, [this]);
  if (!preSubmitEvent.reault) {
    return false;
  }
});

$("input#email").bind("preSubmit", function(e, formElement) {
  window.location.href = "/foo/" + this.value;
  return false;
});
```

`$("form").submit(...);` の部分を共通の JavaScript に切り出しておけば標準的に preSubmit イベントが利用できるような形になりますね。

質問の意図とずれている箇所があったため修正

60
 
 submit のときにゴニョゴニョとしたい部分をイベントとして分離することで、コードのセマンティクスとしてはだいぶスッキリするかと思います。
 
-#### form_tag
-
-form であれば、`window.location.href =` よりは HTTP メソッドに get を指定するようにした方がいいかと思います。
-
-```ruby
-form_tag ({:action => "/foo"}, {:method => "get"}) do
-    ...
-```
-
 #### JavaScript 
 
 ```javascript
 $("form").submit(function() {
   // 当該 form 配下の input タグにバインドされた preSubmit イベントを起動
   $(this).find(":input").trigger("preSubmit", [this]);
+      var preSubmitEvent = jQuery.Event("preSubmit");
+      $(this).find(":input").trigger(preSubmitEvent, [this]);
+      if (!preSubmitEvent.reault) {
+        return false;
+      }
 });
 
 $("input#email").bind("preSubmit", function(e, formElement) {
-  $(formElement).attr("action", "/foo" + this.value);
+  window.location.href = "/foo/" + this.value;
+  return false;
 });
 ```
 

汎用的に、ということであれば jQuery のカスタムイベントを使ってみてはいかがでしょうか。

submit のときにゴニョゴニョとしたい部分をイベントとして分離することで、コードのセマンティクスとしてはだいぶスッキリするかと思います。

JavaScript

$("form").submit(function() {
  // 当該 form 配下の input タグにバインドされた preSubmit イベントを起動
  $(this).find(":input").trigger("preSubmit", [this]);
      var preSubmitEvent = jQuery.Event("preSubmit");
      $(this).find(":input").trigger(preSubmitEvent, [this]);
      if (!preSubmitEvent.reault) {
        return false;
      }
});

$("input#email").bind("preSubmit", function(e, formElement) {
  window.location.href = "/foo/" + this.value;
  return false;
});

$("form").submit(...); の部分を共通の JavaScript に切り出しておけば標準的に preSubmit イベントが利用できるような形になりますね。

汎用的に、ということであれば jQuery のカスタムイベントを使ってみてはいかがでしょうか。

submit のときにゴニョゴニョとしたい部分をイベントとして分離することで、コードのセマンティクスとしてはだいぶスッキリするかと思います。

#### JavaScript 

```javascript
$("form").submit(function() {
  // 当該 form 配下の input タグにバインドされた preSubmit イベントを起動
  $(this).find(":input").trigger("preSubmit", [this]);
      var preSubmitEvent = jQuery.Event("preSubmit");
      $(this).find(":input").trigger(preSubmitEvent, [this]);
      if (!preSubmitEvent.reault) {
        return false;
      }
});

$("input#email").bind("preSubmit", function(e, formElement) {
  window.location.href = "/foo/" + this.value;
  return false;
});
```

`$("form").submit(...);` の部分を共通の JavaScript に切り出しておけば標準的に preSubmit イベントが利用できるような形になりますね。

回答を投稿

汎用的に、ということであれば jQuery のカスタムイベントを使ってみてはいかがでしょうか。

submit のときにゴニョゴニョとしたい部分をイベントとして分離することで、コードのセマンティクスとしてはだいぶスッキリするかと思います。

form_tag

form であれば、window.location.href = よりは HTTP メソッドに get を指定するようにした方がいいかと思います。

form_tag ({:action => "/foo"}, {:method => "get"}) do
    ...

JavaScript

$("form").submit(function() {
  // 当該 form 配下の input タグにバインドされた preSubmit イベントを起動
  $(this).find(":input").trigger("preSubmit", [this]);
});

$("input#email").bind("preSubmit", function(e, formElement) {
  $(formElement).attr("action", "/foo" + this.value);
});

$("form").submit(...); の部分を共通の JavaScript に切り出しておけば標準的に preSubmit イベントが利用できるような形になりますね。

汎用的に、ということであれば jQuery のカスタムイベントを使ってみてはいかがでしょうか。

submit のときにゴニョゴニョとしたい部分をイベントとして分離することで、コードのセマンティクスとしてはだいぶスッキリするかと思います。

#### form_tag

form であれば、`window.location.href =` よりは HTTP メソッドに get を指定するようにした方がいいかと思います。

```ruby
form_tag ({:action => "/foo"}, {:method => "get"}) do
    ...
```

#### JavaScript 

```javascript
$("form").submit(function() {
  // 当該 form 配下の input タグにバインドされた preSubmit イベントを起動
  $(this).find(":input").trigger("preSubmit", [this]);
});

$("input#email").bind("preSubmit", function(e, formElement) {
  $(formElement).attr("action", "/foo" + this.value);
});
```

`$("form").submit(...);` の部分を共通の JavaScript に切り出しておけば標準的に preSubmit イベントが利用できるような形になりますね。