質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
UI

UIはUser Interfaceの略であり、人間がコンピュータとやりとりをするためのシステムです。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Laravel 5

Laravel 5は、PHPフレームワークLaravelの最新バージョンで、2014年11月に発表予定です。ディレクトリ構造がが現行版より大幅に変更されるほか、メソッドインジェクションやFormRequestの利用が可能になります。

解決済

JqueryUI Dialogが二回以上openできない

youthK
youthK

総合スコア0

UI

UIはUser Interfaceの略であり、人間がコンピュータとやりとりをするためのシステムです。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Laravel 5

Laravel 5は、PHPフレームワークLaravelの最新バージョンで、2014年11月に発表予定です。ディレクトリ構造がが現行版より大幅に変更されるほか、メソッドインジェクションやFormRequestの利用が可能になります。

1回答

0評価

0クリップ

32閲覧

投稿2018/01/24 11:55

編集2022/01/12 10:58

わからないこと

いつもお世話になっております。
この度JqueryUIDialogを用い、ajaxでダイアログ内のviewを出力しようとしています。
しかし、おそらくajaxが原因で、ダイアログを一度閉じ、再び開こうとするとエラーが出ます。

エラー
「Uncaught TypeError: $(...).dialog is not a function」

目的は、エラーを解消し、ajax実行時にダイアログ内を表示させ、かつデータを飛ばすことにあります。

ご教授いただければ幸いです。

###コード

html

<div class="dialog" id="addImagesDialog" style="overflow: hidden;display: none; outline: 0px; height: auto;" data-dialog="true"> @include('portal.cv-upload-dialog') </div> <script type="text/javascript" src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script> <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css"> <script type="text/javascript" language="javascript">

portal.cv-upload-dialog(blade)

<div class="dialog-content"> </div> <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script> $(function() { $("#open-cv-dialog").on("click", function(){ $("#addImagesDialog").dialog({ title: "登録", width: 372, modal: true, buttons: [ { text: '送付する', id: 'yes-sending', click: function() { $(this).dialog('close'); } }, { text: 'キャンセル', id: 'no-sending', click: function() { $(this).dialog('close'); $.ajax({ url: "{{action('PortalController@cancelImage')}}", type: 'post', dataType: 'html', // data: fd, // processData: false, // contentType: false }) } } ], open: function() { imgDialogContent(); } }) <?// ダイアログの表示位置をオプションで修正しても変更できなかったので、力技で変更?> $("#addImagesDialog").parent("div.ui-widget").css('top','98px'); }); // ダイアログ内読み込み function imgDialogContent(){ $.ajax({ type : "POST", url : "{{action('PortalController@ajaximg')}}", data: { 'book': 'cv', 'id': "{!!$input['id']!!}" }, dataType: "html", success : function(re) { $("#addImagesDialog").html(re); }, error : function() { alert('失敗しました。'); } }); } }); </script>

php

public function ajaximg() { return view('portal.cv-upload-dialog'); }

※laravelのバージョンは5.1です。

何卒よろしくお願い申し上げます。

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

kei344
kei344

2018/01/25 02:48

まだ質問が「受付中」になっていますが、「ベストアンサー」を選び「解決済」にされてはいかがでしょうか。
youthK
youthK

2018/01/25 03:33

ご指摘ありがとうございます。押した気になっていました

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

UI

UIはUser Interfaceの略であり、人間がコンピュータとやりとりをするためのシステムです。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Laravel 5

Laravel 5は、PHPフレームワークLaravelの最新バージョンで、2014年11月に発表予定です。ディレクトリ構造がが現行版より大幅に変更されるほか、メソッドインジェクションやFormRequestの利用が可能になります。