在移動范圍滑塊后按下“提交”按鈕，新電影將刷新（Laravel）
[英]New films will refresh when the submit button is pressed after the range slider has been moved (Laravel)
問題描述
我正在構建一個將在網站上放映各種電影的Web應用程序。 作為該項目的一部分，我有一些范圍滑塊，可以根據您的心情進行移動。 如果有人要移動滑塊並按Submit，我想顯示一個新的電影列表。
這是我遇到的問題，我可以在頁面上顯示一定數量的電影，但是在移動滑塊后單擊“提交”按鈕后，找不到一種刷新電影的方法。
下面的代碼
上傳（查看）
<link rel="stylesheet" href="CSS/app.css" type="text/css">
<meta name = "viewport" content="width = device-width, initial-scale = 1">
<link rel = "stylesheet" href = "https://www.w3schools.com. /lib/w3.css">
<!DOCTYPE html>
<html>
<head>
<title>Moodslider</title>
</head>
<body>
<!-- Sky logo + Sky cinema logo -->
<div class="box">
<td style="text-align:center;color:black;font-size:50px;">
<img src="/images/sky.png" title="Sky" alt="Sky" width="auto" height="125" />
</td>
<td style="text-align: right;position: relative; color:black;font-size:50px;">
<img src="/images/sky_cinema.png" title="sky_cinema" alt="Sky" width="auto" height="125" />
</td>
</div>
<!-- This is the navigation bar for the homepage and the upload content page. -->
<div>
<ul class="w3-navbar w3-black">
<li><a href="/projects/upload">Moodslider Home</a></li>
<li><a href="/projects/create">Upload Content</a></li>
</ul>
</div>
<div class="w3-row-padding">
<div class="w3-panel">
<h1 style="text-align:center;color:black;font-size:50px;">Select a movie based on your mood</h1>
</div>
<form action="/projects/upload" method="post" enctype="multipart/form-data">
{{ @csrf_field() }}
<div class="col-md-12">
<div class="w3-row-padding">
<div class="w3-col m3 w3-center">
<label for="Agitated"><h3>Agitated</h3></label><br><br>
<label for="Happy"><h3>Happy</h3></label><br><br>
<label for="Tired"><h3>Tired</h3></label><br><br>
<label for="Scared"><h3>Scared</h3></label><br><br>
</div>
<div class="w3-col m6 w3-center">
<br>
<form action="/projects/upload" method="post" enctype="multipart/form-data">
{{ @csrf_field() }}
<div></div>
<input type="range" name="mood1" min="0" max="2" value="1" step="1";/><br><br>
<input type=submit value=Submit />
<br>
<br>
<input type="range" name="mood2" min="0" max="2" value="1" step="1" class="slider" id="myRange"><br><br>
<input type="submit" value="Submit">
<br>
<br>
<input type="range" name="mood3" min="0" max="2" value="1" step="1" class="slider" id="myRange"><br><br>
<input type="submit" value="Submit">
<br>
<br>
<input type="range" name="mood4" min="0" max="2" value="1" step="1" class="slider" id="myRange"><br><br>
<input type="submit" value="Submit">
<br>
<br>
</div>
</form>
<div class="w3-col m3 w3-center">
<label for="Calm"><h3>Calm</h3></label><br><br>
<label for="Sad"><h3>Sad</h3></label><br><br>
<label for="WideAwake"><h3>Wide Awake</h3></label><br><br>
<label for="Fearless"><h3>Fearless</h3></label><br><br>
</div>
</div>
</form>
<!-- display the films images -->
<form action="/projects/upload">
<div class="w3-row">
<div type="text" name="lname" class="w3-col w3-container" style="width:20%"><img src=<?$xml=simplexml_load_file("images/database.xml");
echo '../'.$xml->programme[1]->image?> ; alt="" style="width:100%;max-width:150px"></div>
<div class="w3-col w3-container" style="width:20%"><img src=<?$xml=simplexml_load_file("images/database.xml");
echo '../'.$xml->programme[2]->image?> alt="" style="width:100%;max-width:150px"></div>
<div class="w3-col w3-container" style="width:20%"><img src=<?$xml=simplexml_load_file("images/database.xml");
echo '../'.$xml->programme[4]->image?> alt="" style="width:100%;max-width:150px"></div>
<div class="w3-col w3-container" style="width:20%"><img src=<?$xml=simplexml_load_file("images/database.xml");
echo '../'.$xml->programme[6]->image?> alt="" style="width:100%;max-width:150px"></div>
<div class="w3-col w3-container" style="width:20%"><img src=<?$xml=simplexml_load_file("images/database.xml");
echo '../'.$xml->programme[5]->image?> alt="" style="width:100%;max-width:150px"></div><br>
<!-- display the film name and description -->
<? $xml=simplexml_load_file("images/database.xml") or die("Error: Cannot create object");?>
<div class="w3-row"></div>
<div class="w3-row">
<div class="w3-col w3-container" style="width:20%"><h3><?echo $xml->programme[1]->name?></h3></div>
<div class="w3-col w3-container" style="width:20%"><h3><?echo $xml->programme[2]->name?></h3></div>
<div class="w3-col w3-container" style="width:20%"><h3><?echo $xml->programme[4]->name?></h3></div>
<div class="w3-col w3-container" style="width:20%"><h3><?echo $xml->programme[6]->name?></h3></div>
<div class="w3-col w3-container" style="width:20%"><h3><?echo $xml->programme[5]->name?></h3></div>
<div class="w3-row">
<div class="w3-col w3-container" style="width:20%"><p><?echo $xml->programme[1]->description?></p></div>
<div class="w3-col w3-container" style="width:20%"><p><?echo $xml->programme[2]->description?></p></div>
<div class="w3-col w3-container" style="width:20%"><p><?echo $xml->programme[4]->description?></p></div>
<div class="w3-col w3-container" style="width:20%"><p><?echo $xml->programme[6]->description?></p></div>
<div class="w3-col w3-container" style="width:20%"><p><?echo $xml->programme[5]->description?></p></div>
</div>
</form>
<!--
<form action="/projects/upload" method="post" enctype="multipart/form-data">Select image to upload:
{{ @csrf_field() }}
<input type="file" name="fileToUpload" id="fileToUpload">
<input type="submit" value="Upload Image" name="submit">
</form>
-->
</body>
</html>
ProjectsController（控制器）
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Orchestra\Parser\Xml\Facade as XmlParser;
interface OutputType
{
public function generate();
}
//project class has been imported
use App\Project;
class ProjectsController extends Controller
{
public function index()
{
//because the class has been imported we can reference it like this rather than '\App\Project::all();'
$projects = Project::all();
//passing the JSON to the view
return view ('projects.index', ['projects'=> $projects]); //can also use 'compact('projects') instead of the ['projects'=> $projects]
}
//new method called create
public function create()
{
return view ('projects.create');
}
//new method called store
public function __construct()
{
$this->xml= new \DOMDocument('1.0', 'ISO-8859-15');
}
public function createParent($type)
{
$this->parentElement = $this->xml->createElement($type);
return $this;
}
public function addElement($element, $type)
{
$this->elementGroup = $this->xml->createElement($type, $element);
return $this;
}
public function groupParentAndElements()
{
$this->parentElement->appendChild($this->elementGroup);
return $this;
}
public function generate()
{
$this->xml->appendChild($this->parentElement);
print $xml->saveXML('database.php'); //here I am saving and printing but you can change to suit your needs. It is at this point it is ready to generate the XML
}
public function store()
{
if (isset($_POST['submit'])) {
$xmlType = new XMLType();
$xmlType->createParent('programme')
->addElement('name', $_POST['name'])
->addElement('description', $_POST['description'])
->addElement('mood', $_POST['mood'])
->groupParentAndElements()
->createParent('others')
->addElement('example', 'Form submitted succesfully') //echos response
->groupParentAndElements();
//whenever you wish to output
$xmlType->generate('database.php');
}
return view('projects.upload');
}
//changed this from upload to show
public function upload()
{
return view('projects.upload');
}
//changed this from upload to show
public function show()
{
return view ('projects.upload', compact('user'));
}
public function slider()
{
return view ('projects.upload', compact('user'));
}
}
數據庫（XML）
<?xml version="1.0" encoding="UTF-8"?>
<programmeList>
<programme id="1">
<name>School of Rock</name>
<image>images/schoolofrock.jpg</image>
<description>After being kicked out of a rock band, Dewey Finn becomes a substitute teacher </description>
<mood>Agitated</mood>
</programme>
<programme id="2">
<name>Pitch Perfect 2</name>
<image>images/pitchperfect2.jpg</image>
<description>After a humiliating command performance at The Kennedy Center, the Barden Bellas enter an international competition that no American group has ever won in order to regain their status and right to perform. </description>
<mood>Fearless</mood>
</programme>
<programme id="3">
<name>Big</name>
<image>images/big.jpg</image>
<description>When a pre-teen boy wishes to be big at a magic wish machine, he wakes up the next morning and finds himself in an adult body.</description>
<mood>Tired</mood>
</programme>
</programmeList>
1 個解決方案
解決方案1
0 2018-11-23 16:07:41
您需要發布請求數據（從用戶提交的表單）並根據該數據顯示電影。 您將需要一些邏輯來確定要搜索的數據庫中的心情，並將其設置為要在項目表中搜索的變量$ mood。
在您的控制器中：
public function index(Request $request)
{
// Need logic that checks if there is anything in the request
// If there is nothing in the request, then show all films
// Repeat this for every input slider you have
$mood1 = $request->input('mood1'); // This will return the value of the slider
// You will need some logic which will calculate which mood to search
// your database for, i.e. if $mood1 < 3 && $mood2 > 1 etc.
$mood = /** LOGIC FOR YOUR MOOD **/ ;
$projects = Project::where('mood', $mood);
return view ('projects.index', ['projects'=> $projects]);
}
在您的表格中，您將需要
<form action="/projects/upload" method="POST">
// And importantly, you will need to protect against CSRF when POSTing
{{ csrf_field() }}
您還需要創建一個“ POST”路由。
希望這對您有所幫助！
我希望能夠在Web表單上按下“提交”按鈕后在同一頁面上顯示錯誤
[英]I want to be able to show errors on the same page, after the a submit button has been pressed on a webform
如何在按下提交按鈕后運行我的 testxml.php 文件？
[英]How to get my testxml.php file to run after the submit button has been pressed?
如何在按下“提交”按鈕后刷新（更新）HTML頁面以獲取新數據
[英]How to Refresh (Update) an HTML Page For New Data After the Submit Button is Pressed
當按下提交按鈕而不是頁面刷新時，重新加載php腳本
[英]Reloading a php script when a submit button is pressed rather then page refresh
如果要按下提交按鈕，我想將數據插入到我的表中。 我到目前為止
[英]I want to INSERT data into my table IF the submit button has been pressed. I have this so far
如何在按下“提交”按鈕后將顯示保持在當前幻燈片[javascript滑塊]上
[英]how to keep the display on the current slide [javascript slider] after submit button is pressed
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.