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

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

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

DjangoはPythonで書かれた、オープンソースウェブアプリケーションのフレームワークです。複雑なデータベースを扱うウェブサイトを開発する際に必要な労力を減らす為にデザインされました。

Q&A

解決済

3回答

799閲覧

ある画面を作りたいが、実装方法がわからない

setuna0531

総合スコア128

Django

DjangoはPythonで書かれた、オープンソースウェブアプリケーションのフレームワークです。複雑なデータベースを扱うウェブサイトを開発する際に必要な労力を減らす為にデザインされました。

2グッド

1クリップ

投稿2021/01/04 07:17

#現在の状況
商品登録ページを作成しています。
現在登録されている部門などを確認しつつ、新たに追加する画面の作成に挑戦していますが、
そもそも出来るのかがわからないため、質問させていただきます。

#悩んでいること
左側に現在登録済みの一覧を表示し、一覧より選択した場合には右側に表示している該当の枠
(名称、コードなど)に選択した内容が表示される仕組みを作りたいです。
一覧より選択し、違う画面で詳細を表示することはやったことありますが、同じ画面でPKなどの
情報を渡して表示するという表現方法がわかっていません。

一覧を表示しつつ、「更新・追加・削除」を1画面で完結させたいのですが無理でしょうか。
(追加と更新を同じ画面でやったことがありません)

下記の画像がやりたい内容です。

#画像
イメージ説明
※文字が汚いです。すみません。

#最後に
一覧表示のものを選択し、別画面にて詳細を確認したり、変更したりすることはやったことがあります。
今回の問題点としては、1画面で全て完結させることが出来るのか私の技量ではわからなかったため、
質問させていただく運びとなりました。

わかる方がいらっしゃいましたら、ご教授くださいませ。

ForestSeo, hoshi-takanori👍を押しています

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

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

setuna0531

2021/01/04 07:36

やってほしいことだけを丸投げの質問に見えますか? 出来るかどうか今の技量じゃわからないので教えてほしいといって何が悪いのですか? 低評価の人たちはさぞプログラムにお詳しい方のようですね、 実装したいことを自分が出来ないと諦める人達が低評価押している感じなのでしょうか? 真剣に質問している人への侮辱と受け取れます。
m.ts10806

2021/01/04 07:44

低評価した者ではないですが丸投げだなとは感じました。 やりたいことは書いてあるがやってみたことは書いてないから。 指摘を受け入れない姿勢、というか煽りにも見えるので余計にアドバイスはつかないと思います。 大抵のことは「可能」ですしね。 可能かどうかだけが欲しいのか?それとももっと掘り下げてほしいのか? この質問のゴールが見えづらいのも問題です。 真剣かどうかなんて文字ではかるのは無理。書いてあることしか伝わらない。 例えば「調べたけど分からなかった」とだけ書いてあってもその内容がなければ調べてないのと同じです。
setuna0531

2021/01/04 08:03 編集

m.ts10806さん 貴重なご意見ありがとうございます。 今回の画面を作成するにあたり試したことは書いてはいませんが、 私が現在作ったもので使った技術については触れているかと思います。 (どこまで理解しているかを詳しくは書いていないです。) もっとも、Django単体で可能かどうかの回答が欲しかったということはあります。 ※タグ付けにはその意味があると思っています。 現段階で回答を頂いており、Django単体では難しいとわかったため、この質問は一度クローズさせていただきます。
m.ts10806

2021/01/04 08:56

そもそもで言えば、Webでやる時点でフレームワーク単体でどうにかってありえません。html,css,JavaScriptなしには何もできません。
hoshi-takanori

2021/01/04 10:52

「こういうのを作って欲しい」だったら丸投げですが、「こういうのは Django で作れますか? 作るためにはどういう方法がありますか?」という質問なので丸投げには当たらないと思いました。めげずにがんばって。
BluOxy

2021/01/04 22:27

スキル不足が原因の質問ならスキルを習得して自己解決したら良いかと思います。そしたら質問する必要はなかったでしょう。 習得する過程を飛ばしているから丸投げと評価されているのだと思います。
setuna0531

2021/01/05 00:28

hoshi-takanoriさん コメントありがとうございます! 出来るかわからないので質問していてここまで叩かれるとは思いませんでした… 確かに私のスキル不足ではあるので、もっと奥深くまで勉強してみようと思います。 応援ありがとうございます。!
setuna0531

2021/01/05 00:37

BluOxyさん コメントありがとうございます! 確かに私のスキル不足ですが、ある程度調べてはおり、モデルの一覧を表示しつつその一覧の中の特定のデータを同じ画面に表示している参考資料が見つからなかったので質問させていただく運びとなりました。 WEBの技術に関しては初心者レベルしかわからないので、今回のわからない原因はおそらくそこにあります。 自己解決できるほどの技量を持ち合わせていなかったので、質問でヒントを得ようとしました。 自分なりに勉強はしていくつもりなので、また質問した際にはお助けください。 コメントありがとうございました!
m.ts10806

2021/01/05 00:40

「指摘」は「攻撃ではない」ので「叩かれる」という認識は少しかえたほうが前にすすめると思います。
setuna0531

2021/01/05 01:26

m.ts10806さん コメントありがとうございます。 確かに「叩かれる」という表現は間違ってますね、すみません。
guest

回答3

0

ベストアンサー

前提として「大抵のことはできる」ということは頭に入れておいてください。
プログラムは書いたとおりにしかできないので「そのように動くように作ればできる」ということになります。

どこまでの確度やレベルでの実現方法を望んでいるか分からないので言語やフレームワークを限定しない回答をしますが、「Webサーバーで動く言語と、HTMLだけでも実現可能」ということになります。

別にレイアウトなんて知らん、インタラクティブな動きもなくていい という前提ですけどね。
コメントでは「何もできません」と書きましたが、「まともに見れるようなページにはならない」という意味が含まれています。


結局は、基礎内容の組み合わせの発想です。

それぞれ独立したページで出来るなら、それを1ページにまとめるだけです。

考えてみてください。

  • 一覧表示に必要な要素・情報はなに?
  • 登録処理に必要な要素・情報はなに?
  • 更新処理に必要な要素・情報はなに?
  • 削除処理に必要な要素・情報はなに?

あとは1ページにまとめる際に「同時に来てはいけない要素・情報はなに?」を検討事項に加えます。
「同じ情報を必要とするが同時にしてはいけない処理はなに?」も洗い出せればほぼ出来上がりです。

具体的には。
「登録と更新はほとんど同じ情報を必要とするが更新は”更新対象の一意情報(IDなど)”が必要だから同時には処理できない」とか。
「更新と削除は”更新対象の一意情報(IDなど)”が必要だけど同時に処理させてはいいけない」
とか。

「来る」は本来「リクエスト」と呼ばれる概念です。
処理した結果を返すのを「レスポンス」。

「リクエスト」が何か決まれば、それぞれの処理を見分ける「モード」のようなものを渡し、
同時にさせてはいけない処理がある場合は、そのモードによって分岐を利用しそのモードの処理だけ行うようにする。

流れ

削除モード→対象の削除処理を行う 更新モード→対象の更新処理を行う 登録モード→登録処理を行う 更新対象取得モード→更新対象の取得を行う→更新モードとする 一覧情報取得 画面表示 ※ボタンにそれぞれ「モード」を持たせる ※「更新対象取得モード」のときは登録フォームに初期値を与え、IDを隠し要素として持つ

これらを全てフォーム送信によってリクエスト処理を行いますし、
毎回フォーム送信します。
「同期処理」と言います。

これにより、「Webサーバで動作する言語」と「HTML」のみで
とりあえず「更新・追加・削除」を1画面で完結ができます。

蛇足、バックグラウンドで処理を行い、結果を受け取るのを「非同期処理」と言います。
「Ajax」など、もしかしたら聞いたことがあるかもしれませんね。

あくまで必要な処理に必要なリクエストを送って必要な処理をさせることが大事なので、
それは画面が分かれていようと1つであろうと関係はないわけです。
分かれているときに送っていたリクエストを自画面に送るように変更し、混ざってはいけない処理を混ざらないようにするだけ。


身近にある実現例を見てみましょう。

teratailのコメント欄とか、投稿も編集も参照も1フォームで行えているように見えますよね。

編集ボタン押すとそのコメントが入力に切り替わります。
こういう動きをさせたい場合にJavaScriptやCSSの力が必要になるというだけです。
結局は「編集ボタンを押したときにボタンを編集モードに切り替え、IDを裏で持たせる」
この概念は変わりません。

質問の投稿画面と編集画面は同じフォームのはずです。
リクエスト(おそらくURL)によって出力する内容を分けています。

あくまで「リクエスト」と「レスポンス」の範疇ですので、確実におさえてください。

これが分かるようになれば、あとは「どう見せるか」「どういう動作をさせるか」決めるだけなので、調べる方向性も定まり、自分でできるようになってきます。

投稿2021/01/04 10:45

m.ts10806

総合スコア80875

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

setuna0531

2021/01/05 00:45

m.ts10806さん 回答ありがとうございました! ものすごくわかりやすかったです! 各それぞれの処理画面は作成したことがあり、それを組み合わせたことがなかったため今回質問させていただきました。 別画面で処理を行う際にも、特定のリクエストを受けたら処理実行というプログラムを書いていたので、それを1画面で応用すれば実装できそうな感じですね、 とても参考になる回答でした! Javascriptがまだ勉強段階なので、もう少し力を入れてみたいと思います。 お忙しい中、ご回答ありがとうございました!
m.ts10806

2021/01/05 00:59

勉強もそうですが、作りたいものがある場合、明確な場合はなるべく詳細に機能を決めておくことです。 そうすることにより必要な部品が決まります。部品が決まってくればキーワードも具体的になって、調べやすくなります。 いかに細分化できるかが鍵です。
guest

0

このようなアプリケーションの形を SPA (Single Page Application)と呼びます。そして SPA を作るには Django 単体の力では無理で、JavaScript の力を借りることになります。ただイチからそのようなアプリケーションを書くととても大変なので React や Vue.js といったフレームワークを利用することがほとんどです。「Django SPA」などをキーワードに検索すると作り方がわかるでしょう。

投稿2021/01/04 07:50

A_kirisaki

総合スコア2853

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

setuna0531

2021/01/04 07:56

なるほど・・・! Djangoだけだとやはり作ることが難しいですか。 ご回答ありがとうございます! ご回答いただいた内容についてもう少し勉強してみます。 ありがとうございました^^
guest

0

もっとも、Django単体で可能かどうかの回答が欲しかったということはあります。

可能かどうかだけの回答で良いのなら。

djangoのみという表現の程度にもよりますが、django用のモジュールを追加すればリアルタイムで表示を切り替える処理を極力意識せずにdjangoの書き方のみで作る事が出来そうです。
自分では試しておらず日本語の情報も無く英語圏での試してみた的な情報もパッとは出てこないので、飽くまで出来そうという表現に留めます。

投稿2021/01/06 00:17

hentaiman

総合スコア6426

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

setuna0531

2021/01/06 00:25

hentaimanさん ご回答ありがとうございます! Djangoのモジュールとしてそのようなものがあるのですね・・・! 調べていただきありがとうございます。 私の方でも、一度調べてみたいと思います! ご協力ありがとうございました。
hentaiman

2021/01/06 00:31

出来そうとは言いましたが個人的にオススメはしません。 回答に書きましたが、英語圏の試してみた的な情報が全然出てきません。もし有用なモジュールだったらもっと試されているはずです。なのでstackoverflowでも情報ほとんど出ませんでした。 という事でモジュール調べるよりはmtsさんの意見を参考に設計する方が良いと思います。
setuna0531

2021/01/06 00:36

hentaimanさん なるほど・・・ 確かにとても有能なモジュールですが使われていないとなると何かしらの原因があるんですかね・・・ stackoverflowでも情報がほとんどないとなると本当に使ってる人が少ないんですね 一応、参考程度に見てみます! m.tsさんの方針で一度考えてみます!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.35%

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

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

質問する

関連した質問