0
Mein Code:jquery kann nicht senden Sie das Formular
$(document).ready(function(){
console.log("jquery works");
// **** Global Variables ****
//staring ingridient number for new ingridients
$ing_num = 3;
var new_label;
var new_input;
$("#add_icon").click(function(){
console.log("add clicked. Add ingridient input");
$new_label = $("#new_ingrs").append("<li class='label_list'><label class='input_label' for='ingr"+$ing_num+"'>Ingridient no."+$ing_num+"<label></li>");
$new_input = $("#new_ingrs").append("<li class='recipe_content'><input type='text' placeholder='Ingridient' id='ingr"+$ing_num+"' name='ingr"+$ing_num+"' value=''><i class='uk-icon-remove' id='remove_ingr' name='remove_ingr'></i></li>");
$ing_num = $ing_num + 1;
});
$("#remove_ingr").click(function(){
console.log("button click");
});
$("#add_new_rec").click(function(){
\t console.log("button click");
$("#rec_form").submit(function(event){
var form_data = $(this).serializeArray();
console.log(form_data);
event.preventDefault();
\t \t console.log("submit form");
var stred_form = JSON.stringify(form_data);
// change the pos file to php
// to parse the data to the json file
$.ajax({
url: "http://localhost:81/Recipes/backend/new_recipe.php",
type: "POST",
data: {formed_data: stred_form},
dataType: "json",
cache: false,
success: function(){
console.log("Success of submiting the form");
},
statusCode: {
404: function(){
console.log("file not found");
}
},
error: function(xhr, desc, err) {
console.log(xhr);
console.log("Details: " + desc + "\nError:" + err);
}
});
});
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<script src="scripts/jquery-2.2.4.js"></script>
<script src="scripts/script.js"></script>
<script src="scripts/jquery-ui-1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="scripts/jquery-ui-1.11.4/jquery-ui.min.css">
<link rel="stylesheet" href="styles/uikit-2.26.3/css/uikit.gradient.min.css">
<link rel="stylesheet" href="styles/style.css">
<meta charset="utf-8">
<title>Recipes</title>
</head>
<body>
<div class="uk-grid">
<div class="main_cont uk-width-1-1">
<div class="uk-grid">
<div class="form_wraper uk-width-3-10">
<p class="form_title">Add Recipe</p>
<ul>
<form class="new_rec" action="" method="post" id="rec_form">
<li class="label_list"><label class="input_label" for="rec_name">Recipe Name<label></li>
<li class="recipe_content"><input type="text" placeholder="Recipe Name" id="rec_name" name="rec_name" value="" required></li>
<li class="label_list break10"><label class="input_label" for="ingr1">Ingridient no.1<label></li>
<li class="recipe_content"><input type="text" placeholder="Ingridient" id="ingr1" name="ingr1" value="" required></li>
<li class="label_list"><label class="input_label" for="ingr2">Ingridient no.2<label></li>
<li class="recipe_content"><input type="text" placeholder="Ingridient" id="ingr2" name="ingr2" value="" required></li>
<i class="uk-icon-plus uk-icon-large break10 add_icon" id="add_icon" style="margin-left: 150px;"></i>
\t \t \t
<!-- add new inputs for more ingridients -->
<div id="new_ingrs"></div>
<li class="label_list break10"><label class="input_label" for="rec_image">Recipe Image<label></li>
<li class="recipe_content"><input type="file" placeholder="Recipe Image" id="rec_image" value=""></li>
<li class="add_new_rec"><button id="add_new_rec" class="uk-button-success">Add New</button></li>
</form>
</ul>
</div>
</div>
</div>
</div>
</body>
</html>Wenn ich auf die Schaltfläche Entfernen klicken I console.log Nachricht nicht übernehmen kann. Auch kann ich das nicht abliefern und erhalte einen Fehler: jquery-2.2.4.js:9175 POST http://localhost:81/Recipes/backend/new_recipe.php net::ERR_CONNECTION_REFUSED.
1) Also Port 81 ist auf localhost geschlossen? 2) Wo ist der PHP-Teil der Frage? 3) Viel zu viel Code, um zu erwarten, dass Leute durchlesen. –
ok ich werde meine antwort korrigieren, können sie die probleme beantworten, warum entfernung taste nicht funktioniert? – koolio
Es scheint keine "Entfernen-Schaltfläche" in der Markierung zu geben, die Sie angegeben haben. –