JSで要素位置を並び変える不具合

解決済 meijinochoco
(@meijinochoco)

6年、 1ヶ月前
―――――
概　要
―――――

JSで要素位置を並び変えたところ、「投稿ボタン」をクリックしても、記事が投稿されなくなってしまいました。

―――――
詳　細
―――――

ユーザー投稿機能を設置する「WP User Frontend」というプラグインを利用しています。

投稿画面の構成にあたり、「投稿ボタン」の位置を下記JSで「.xxx」の後に変更いたしました。

すると、「投稿ボタン」をクリックしても、記事が投稿されなくなってしまったのです。
```
(function($){
$(function(){
    $('.xxx').after($('.wpuf-submit'));
});
})(jQuery);
```
position:absoute;で「無理やり移動する」ではなく、

なんとかJSで「並び替える」がいいのですけれど、

並び替えてもきちんと投稿できるようにするためにはどうすればいいか、、、

どなたかご存知の方がいらっしゃいましたらご教示頂けませんでしょうか？

何卒よろしくお願い致します。

6件の返信を表示中 - 1 - 6件目 (全6件中)

munyagu
(@munyagu)

6年、 1ヶ月前

こんにちは

ブラウザのコンソールでエラーを確認し、該当箇所のWP User FrontendのJavaScriptのソースを読んでどのようなセレクタ指定で見つからなくなっているのかを確認し、JavaScriptでセレクタに合ったDOMを生成すれば動くと思います。
トピック投稿者 meijinochoco
(@meijinochoco)

6年、 1ヶ月前
ありがとうございます。エラーとやらは下記でした。

当該箇所の見つけ方について、ご教示いただけましたら幸いです。
```
<div id="error"><p class="wpdberror"><strong>WordPress データベースエラー:</strong> [Table 'zjp_99a8d0.wp_popularpostsdata' doesn't exist]<br /><code>INSERT INTO wp_popularpostsdata

            (postid, day, last_viewed, pageviews) VALUES (428, '2018-03-04 02:35:53', '2018-03-04 02:35:53', 1)

            ON DUPLICATE KEY UPDATE pageviews = pageviews + 1, last_viewed = '2018-03-04 02:35:53';</code></p></div><div id="error"><p class="wpdberror"><strong>WordPress データベースエラー:</strong> [Table 'zjp_99a8d0.wp_popularpostssummary' doesn't exist]<br /><code>INSERT INTO wp_popularpostssummary

            (postid, pageviews, view_date, view_datetime) VALUES (428, 1, '2018-03-04', '2018-03-04 02:35:53')

            ON DUPLICATE KEY UPDATE pageviews = pageviews + 1, view_datetime = '2018-03-04 02:35:53';</code></p></div>WPP: Oops, could not update the views count!
```
- この返信は6年、 1ヶ月前にmeijinochocoが編集しました。
munyagu
(@munyagu)

6年、 1ヶ月前

これはブラウザのコンソールに出るエラーではなく、Popular Postsのデータベースエラーのようですね。
順番を並び替えなくても出ているものではないですか？

トピック投稿者 meijinochoco
(@meijinochoco)

6年、 1ヶ月前

失礼しました。おっしゃるとおりです。
しかしコンソール画面にはこれしか出ていないようですね。。
また何かありましたらアドバイスよろしくお願い致します。
ishitaka
(@ishitaka)

6年、 1ヶ月前
こんにちは

.wpuf-submit を form の外に移動しようとしていませんか？
.wpuf-submit 内には submit ボタン以外にも非表示のフィールドがあるので form の外に移動するのはちょっと厄介です。

ボタンだけであれば下記のようなスクリプトで出来るかもしれません（たぶん）。
```
$(".xxx").after('<input type="button" id="create-button-sub" value="作成" />');
$("#create-button-sub").on("click", function () {
  $("form.wpuf-form-add").submit();
});
```
移動先を form 内に留めておくのがいいかと思います。
トピック投稿者 meijinochoco
(@meijinochoco)

6年、 1ヶ月前

お世話になっております。
おっしゃる通り、formの外に無理やり持って行ってしまっていたようです。
そのように書いて防ぐのですね。ありがとうございます！ご指導感謝いたします！

6件の返信を表示中 - 1 - 6件目 (全6件中)

トピック「JSで要素位置を並び変える不具合」には新たに返信することはできません。

トピックタグ

表示