- 締切済み
PHPでレイティングバーの値を取得
下記のようなJQuery スクリプトにおいて、 レイティングバーの値を、PHP変数に取得するには どうすればいいのでしょうか。ご指導お願い致します。 ちなみに、 $manzokudo = $_POST['rating']; var_dump($manzokudo); で、ダンプしたところ、中身がNULLでした。 【detail.php】 <link rel="stylesheet" type="text/css" href="jquery.rating.css"> <script type="text/javascript" src="jquery-2.1.3.js"></script> <script type="text/javascript" src="http://code.jquery.com/jquery-migrate-1.1.0.js"></script> <script type="text/javascript" src="jquery.rating.js"></script> <script type="text/javascript"> $(function () { // レーティングバーを有効化 $('.starbar').rating({ cancel: '消去', // 「キャンセル」ボタンのテキスト // ★アイコンをクリックした時の処理 callback: function(value){ // detail.phpに対してレイティングバーの値を送信 $.post( 'detail.php', { rating: value }, function(){ window.alert('「' + value + '」をつけました。'); } ); } }); }); </script> </head> <body> <?php $_POST[] ?> </body> </html>
- beterugius
- お礼率87% (194/221)
- JavaScript
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
みんなの回答
そもそもレイティングバーとは何を指し、具体的にどのようなものですか？
- sanzero
- ベストアンサー率56% (58/102)
javascriptはクライアント、phpはサーバ側の処理ということは理解されていますでしょうか。 >$manzokudo = $_POST['rating']; >var_dump($manzokudo); >で、ダンプしたところ、中身がNULLでした。 これほいつのタイミングのことでしょうか？ フレームワーク使われていないのでしたら、サーバにPOSTした後の処理はdetail.phpに if(isset($_POST['rating'])) ( // なんか処理 // 処理に成功したらtrueを返す if(sucsess) { echo true; } else { echo false; } exit; ) というような感じで書き、javascript側では処理が成功したかどうかで処理を書けばよいかと。
お礼
ご回答、どうも有難うございました。
関連するQ&A
- 教えてください! lightboxとskitter
javascriptがまだよく理解できていないので、 愚問に思われるかもしれないですが、上手く動作しなくて困っています。 <head>内に下記のように記述したのですが、lightboxが上手く作動しません。 記述に問題があるんでしょうが、調べても全くわからないので こちらに投稿させていただきました。 どなたかこの問題の解き方をお教えください。 よろしくお願いします。 <link rel="stylesheet" type="text/css" href="css/lightbox.css"> <!--lightbox--> <script src="js/prototype.js" type="text/javascript"></script> <script type="text/javascript" src="js/builder.js"></script> <script type="text/javascript" src="js/effects.js"></script> <script type="text/javascript" src="js/lightbox.js"></script> <script type="text/javascript" src="js/smartRollover.js"></script> <!--smartRollover--> <script type="text/javascript" src="js/jquery.quickflip.source.js"></script> <link rel="stylesheet" type="text/css" href="css/skitter_css/skitter.styles.css"> <!--Skitter--> <style type="text/css"> .box_skitter_large{ width:490px;height:190px; } </style> <script type="text/javascript" src="js/skitter_js/jquery-1.5.2.min.js"></script> <script type="text/javascript" src="js/skitter_js/jquery.skitter.js"></script> <script type="text/javascript" src="js/skitter_js/jquery.easing.1.3.js"></script> <script type="text/javascript" src="js/skitter_js/jquery.animate-colors-min.js"></script> <script type="text/javascript"> $(function(){ $('.box_skitter_large').skitter({interval: 8000}); <!--数字を大きくするとSkitterの時間がゆっくりになる--> //$('.box_skitter_large').skitter({thumbs: true, label: false,}); }); </script>
- ベストアンサー
- JavaScript
- jquery lightboxを設定しようとしていますが問題がでてます
jquery lightboxを設定しようとしていますが問題がでてます.... functionの部分を htmlに直接表記すれば動く状態ですが、 functionの部分を外部に登録するとなぜか動かなくなってしまいます。 jquery.lightbox-0.5.min.jsというファイルにファンクションを書き足せばいいとの ことですが.. なにか 以下のＨＴＭＬソースに足らない部分がありますか？ ご教授ねがいます。 <link href="css/top.css" rel="stylesheet" type="text/css"> <link href="css/print.css" rel="stylesheet" type="text/css" media="print"> <link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script> <script type="text/javascript"> $(function() { $('.up_image a').lightBox({ overlayBgColor: '#FFF', overlayOpacity: 0.7, txtImage: '画像', txtOf: 'の' } ); }); </script> </head>
- ベストアンサー
- JavaScript
- 複数のjQueryを使用するときの記述の仕方
今、こちらのjQueryと http://jsajax.com/Articles/jQueryLavaLamp3/1083 こちらのjQueryを http://www.css-lecture.com/log/javascript/039.html 同じページ内で使用しようとしています。 記述は以下の通りです。 ---------------------------------------------------- <!-- ▼前者のjs --> <script src="js/jquery-1.2.6.js" type="text/javascript"></script> <script src="js/jquery.easing.min.js" type="text/javascript"></script> <script src="js/jquery.lavalamp.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function() { $("#lavaLamp").lavaLamp({ fx: "backout", speed: 700, click: function(event, menuItem) { return false; } }); }); </script> <!-- ▼後者のjs --> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript">google.load("jquery", "1.3");</script> <script type="text/javascript" src="js/main/jquery.cycle.js"></script> <script type="text/javascript" src="js/main/slideshow.js"></script> このように記述しても後者のものしか動きません。 前後逆にすると前者が動きます。 以前の質問でjQueryのファイルには記述する順番があるとお答えを頂いたのですが、 調べても初心者の私には理解できず・・・。 こちらのファイルを同時に使用するにはどのような順番で記述したら宜しいのでしょうか？ 大変困っております、どうか宜しくお願い致します。
- 締切済み
- JavaScript
- このHTMLの意味はなんでしょうか？
<script type="text/javascript" src="scripts/jquery-1.7.2.min.js"></script> <script type="text/javascript" src="scripts/jquery.queryloader2.js"></script> <script type="text/javascript" src="scripts/jquery.parallax-1.1.3.js"></script> <script type="text/javascript" src="scripts/jquery.localscroll-1.2.7-min.js"></script> <script type="text/javascript" src="scripts/jquery.scrollTo-1.4.2-min.js"></script> <script type="text/javascript" src="scripts/jquery.easing.1.3.js"></script> <script type="text/javascript" src="scripts/jquery.scrollorama.js"></script> <script type="text/javascript" src="scripts/jquery.scrolldeck.js"></script> <script type="text/javascript" src="scripts/jquery-contained-sticky-scroll.js"></script> <script type="text/javascript" src="scripts/lightbox.js"></script> <script type="text/javascript" src="scripts/parallax01.js"></script> <script type="text/javascript" src="scripts/yazirusi01.js"></script> <script type="text/javascript" src="scripts/jquery.mousewheel.js"></script> <script type="text/javascript" src="scripts/jquery.easie.js"></script> <script type="text/javascript" src="scripts/jquery.smoothScroll.js"></script> <script type="text/javascript" src="scripts/php_date.js"></script> <script type="text/javascript" src="scripts/script.js"></script> とあるサイトのソースの一部に、このような文章が書かれていました。 一体これはどういう意味なんでしょうか？ どなたか解説お願いします
- ベストアンサー
- HTML
- 複数jQueryの配置で干渉 設置位置
Javascript事は全くわかりませんが、色々なプラグインとしてjQueryを利用しています。 ----------------- jQueryに干渉があったようで、正常に動作させたいのですが、疑問があります。 １サイト目（HTML 最下部に配置） <script src="vendor/jquery.min.js" type="text/javascript"></script> <script src="js/layout.min.js" type="text/javascript"></script> 正常に動作します。 ２サイト目（HTML head内に配置） <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="js/abcd.js" type="text/javascript"></script> 正常に動作します。 上記の２サイトを合体させた：（HTML 最下部に配置） <script src="vendor/jquery.min.js" type="text/javascript"></script> <script src="js/layout.min.js" type="text/javascript"></script> <script src="js/abcd.js" type="text/javascript"></script> すると、 layout.min.jsに不具合がでるようです・・・ <script src="vendor/jquery.min.js" type="text/javascript"></script> <script src="js/layout.min.js" type="text/javascript"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="js/abcd.js" type="text/javascript"></script> でも、ダメです。 <script src="vendor/jquery.min.js" type="text/javascript"></script> を <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> に変更してもダメでした。 tel.js内を、 jQuery.noConflict(); (function($) { $(function(){ を $j に変えたり、 jQuery に 書き替えてもダメでした・・・ そこで、以下のように移動しましたら動作しました。 （HTML header内に配置） <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="js/abcd.js" type="text/javascript"></script> （HTML 最下部に配置） <script src="vendor/jquery.min.js" type="text/javascript"></script> <script src="js/layout.min.js" type="text/javascript"></script> 上記のように、 HTML head部と、HTML 最下部に分けるのは、正しい方法なのでしょうか？
- 締切済み
- JavaScript
- prototype+jquery+プラグイン
prototype.jsとjqueryとプラグイン系の読み込み方が良くわかりません。 クロスブラウザ対応のMP3プレイヤーを導入したく追加したのですが 順番を並べ変えたりいろいろしましたが導入する事ができずにこまっています。 何かいい方法はないでしょうか？ エラーの内容も順序によって様々です・・・・ <script type="text/javascript" src="prototype.js"></script> <script type="text/javascript" src="lightbox.js"></script> <script type="text/javascript" src="lightbox_shortcut_keys_addon.js"></script> <script type="text/javascript" src="slide3/script/jquery-1.2.2.js"></script> <script type="text/javascript" src="jquery.cycle.all.js"></script> <script type="text/javascript" src="jquery.easing.1.3.js"></script> <script type="text/javascript" src="jquery.jcarousel.pack.js"></script> <script type="text/javascript"> jQuery.noConflict(); var $j = jQuery; </script> 以下追加===================================================== <script type="text/javascript" src="jquery-1.4.2.js"></script> <script type="text/javascript" src="jquery.compat-1.3.js"></script> <script type="text/javascript" src="jquery.jplayer.min.js"></script> <script type="text/javascript"> jQuery.noConflict(); var $j = jQuery; $j(document).ready(function(){ $("#mp3").jPlayer(); }); </script>
- 締切済み
- JavaScript
- Camera slideshowの使い方について
jQueryプラグイン"Camera slideshow"を試しに使ってみたのですが、まったく動きません。 どこが間違っているのか見当もつかなく困っています。 【head内】 <head> <!--省略--> <link rel="stylesheet" id="camera-css" href="/camera.css" type="text/css" media="all"> <script type="text/javascript" src="/js/jquery.min.js"></script> <script type="text/javascript" src="/js/jquery.mobile.customized.min.js"></script> <script type="text/javascript" src="/js/jquery.easing.1.3.js"></script> <script type="text/javascript" src="/js/camera.js"></script> <script type="text/javascript" charset="utf-8"> <script type="text/javascript"> jQuery(function(){ jQuery('#camera').camera(); }); }); </script> </head> 【HTML部】 <div class="camera_wrap camera_blue_skin" id="camera"> <div data-src="../images/slides/bridge.jpg"></div> <div data-src="../images/slides/leaf.jpg"></div> <div data-src="../images/slides/road.jpg"></div> </div> この情報だけで質問をするのが失礼だったらすいません。 初心者なもので誠に申し訳ございませんが、改善方法をどなたかご教授いただければ大変助かります。 よろしくお願いしますm(_ _)m
- ベストアンサー
- JavaScript
- 一部のjQueryとmootoolsが競合します
dropdownメニューのdroppy(jquery)とmootoolsを使用したカレンダーが競合してしまいます。 mootoolsのカレンダーhttp://www.electricprism.com/aeron/calendar/ とメールフォームプロ http://www.synck.com/contents/download/cgi-perl/mailformpro.html のjqueryの組み合わせは問題ありませんでした。そこにdroppy http://onehackoranother.com/projects/jquery/droppy/ が入ると動かなくなります。 助けて頂ければ嬉しいです。よろしくお願いいたします。 jQuery.noConflict();やDollar Safe Modeなどもやってみましたが、うまくいきません。どこが間違っているのでしょうか？ <script type="text/javascript"> jQuery.noConflict(); jQuery(function(){ jQuery("#nav").droppy(); }); </script> ----------------------------- <script type="text/javascript"> $(function() { $("#nav").droppy(); }); (function($) { window.addEvent('domready', function() { myCal1 = new Calendar({ date1: 'Y/m/d' }, { direction: 1, tweak: {x: 6, y: 0} }); }); }(document.id)); </script> ---元はこちら↓-------------- <script type="text/javascript" src="commons/jquery.js"></script> <script type="text/javascript" src="js/jquery.droppy.js"></script> <script type="text/javascript"> $(function() { $("#nav").droppy(); }); </script> メールフォームプロ↓ <script type="text/javascript" src="commons/mfp.lang.js" charset="UTF-8"></script> <script type="text/javascript" src="commons/mfp.extensions.js" charset="UTF-8"></script> <script type="text/javascript" src="commons/mailform.js" charset="UTF-8"></script> <script type="text/javascript" src="postcodes/get.cgi?js" charset="UTF-8"></script> カレンダー↓ <script type="text/javascript" src="js/mootools.js"></script> <script type="text/javascript" src="js/calendar.rc4.js"></script> <script type="text/javascript"> //<![CDATA[ window.addEvent('domready', function() { myCal1 = new Calendar({ date1: 'Y/m/d' }, { direction: 1, tweak: {x: 6, y: 0} }); }); //]]> </script>
- ベストアンサー
- JavaScript
- パラメータが送信毎に変わる場合の渡された値の取得
jQueryのAutoSuggertプラグインを使用したオートコンプリートを実装したいのですが、 入力された値の取得方法が分かりません。 http://code.drewwilson.com/entry/autosuggest-jqu … 質問させていただきます。 サンプルを見ながら試行錯誤して入力フォームの作り方は分かったのですが、 入力された値の取得方法がわからず公式サイトも英語なので困っています。。 警告ダイアログで入力されたものを表示させたいのですがその方法がわかりません。。 できれば複数選択されていれば複数表示させたいです。 ソースは以下のように書いています。 「入力された値の表示」を押すとGETで値が送信されるようにななったのですが、 パラメータが as_values_074=***** と_074とランダムな数字が余計に付加されてしまうようで、 GETされた値の取得ができないのです。 困っています。。 よろしくお願いいたします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta http-equiv="Content-Style-Type" content="text/css"> <title>AutoSuggest jQuery Plugin</title> <script type="text/javascript" src="http://skuare.net/test/js/jquery-1.3.2.js"></scr … <script type="text/javascript" src="http://skuare.net/test/js/jquery.autoSuggest.js" … <link rel="stylesheet" href="http://skuare.net/test/css/autoSuggest.css" type="text/css"> <script type="text/javascript"> $(document).ready(function() { var data = {items: [ {value: "1", name: "Mick Jagger"}, {value: "2", name: "Johnny Storm"}, {value: "3", name: "Richard Hatch"}, {value: "4", name: "Kelly Slater"}, {value: "5", name: "Rudy Hamilton"}, ]}; $("input[type=text]").autoSuggest(data.items, {selectedItem: "name", searchObj: "name"}); }); </script> </head> <body> <h3>サンプル</h3> <form action="autosuggest.html" name="name" method="GET"> <input type="text" value=""> <input type="submit" value="入力された値の表示"> </form> <?php $as_values = $_GET['as_values']; echo '入力されたお名前は『'.$as_values.'』です。'; ?> </body> </html>
- 締切済み
- JavaScript
- 同HTML内で複数のjQueryを設置する方法
Movable Type５で作製しています。 複数のjQueryを使用し、（Ａ）はヘッダーにメニュー、（Ｂ）はコメントフォームにテキストをうっすらと出すプラグインを適用させようとしています。 それぞれ単品では問題なく作動するのですが、下記のように記述するとＢのみが作動する状態です。 jQueryもｊｓもよくわからない素人なのでわかりやすくご説明を頂けるとありがたいです。 使用しているものは以下です。 ---------------------------------------- <script type="text/javascript" src="<$mt:Link template="javascript"$>"></script> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript">google.load("jquery", "1.3");</script> <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js'></script> <script type="text/javascript"> var $ = jQuery = jQuery.noConflict().extend(true, $); … </script> <script type="text/javascript" src="<$mt:BlogURL$>js/jquery.updnWatermark.js"></script> <script type="text/javascript"> jQuery(document).ready(function($) { $.updnWatermark.attachAll(); }); </script> <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js'></script> <script type="text/javascript" src="<$mt:Link template="javascript"$>"></script> <script type="text/javascript" src="<$mt:Link>index/js/jquery-1.1.3.1.min.js"></script> <script type="text/javascript" src="<$mt:Link>index/js/jquery.easing.min.js"></script> <script type="text/javascript" src="<$mt:Link>index/js/jquery.lavalamp.min.js"></script> <script type="text/javascript"> $(function() { $("#1, #2, #3").lavaLamp({ fx: "backout", speed: 800, click: function(event, menuItem) { return true; } }); }); </script> http://okwave.jp/qa/q6602248.html ↑に質問をされた方のは見たのですが、それでもわかりません（同様の質問なのかも不明ですが・・・） 本当にわからないので、宜しくお願いします。
- ベストアンサー
- JavaScript
補足
★で5段階評価するバーです。