У меня есть php-файл, который отправляет форму в БД, включая загрузку файла. Как сделать mordern, реализуя jquery ajax - PullRequest
0 голосов
/ 09 сентября 2018

У меня есть php-файл, который отправляет форму в БД, включая загрузку файла. Как сделать mordern, реализуя jquery ajax.

Я имею в виду, я хочу разбить этот файл на две части. А. HTML-файл и. php файл и подключите его через jquery ajax.

Любая идея. Я новичок.

Вот код части html: -

 <h1>Add Supplier Design</h1>

<form class="form-horizontal row-border" enctype="multipart/form-data" id="addSupplierDesign" name="form" method="post" onsubmit="return do_add_supplier_design();" action="" style="padding-right: 10%; padding-left: 10%;">
<div class="form-body">

    <div class="form-group">
        <label for="lblSupplierName">Supplier Name<span class="required">*</span></label>
        <div class="position-relative has-icon-left">
            <select name="cmbSupplierName" id="cmbSupplierName" class="form-control required" required="required">
            </select>
            <div class="form-control-position">
                <i class="fa fa-user-tie"></i>
            </div>
        </div>
    </div>

    <div class="form-group">
        <label for="lblDesignNumber">Design Number/SKU <span class="required">*</span></label>
        <div class="position-relative has-icon-left">
            <input type="text" name="txtDesignNumber" class="form-control required" placeholder="Design Number" id="txtDesignNumber" required="required">
            <div class="form-control-position">
                <i class="fa fa-pen-nib"></i>
            </div>
        </div>
    </div>

    <div class="form-group">
        <label for="lblPricePurchase">Price Purchase <span class="required">*</span></label>
        <div class="position-relative has-icon-left">
            <input type="number" name="txtPricePurchase" class="form-control required" placeholder="Price Purchase" id="txtPricePurchase" required="required">
            <div class="form-control-position">
                <i class="fa fa-rupee-sign"></i>
            </div>
        </div>
    </div>

    <div class="form-group">
        <label for="lblPriceSale">Price Sale <span class="required">*</span></label>
        <div class="position-relative has-icon-left">
            <input type="number" name="txtPriceSale" class="form-control required" placeholder="Price Sale" id="txtPriceSale" required="required">
            <div class="form-control-position">
                <i class="fa fa-rupee-sign"></i>
            </div>
        </div>
    </div>

    <div class="form-group">
        <label for="lblTotalMarketingCostPerWeek">Total Marketing Cost Per Week <span class="required">*</span></label>
        <div class="position-relative has-icon-left">
            <input type="number" name="txtTotalMarketingCostPerWeek" class="form-control required" placeholder="Total Marketing Cost Per Week" id="txtTotalMarketingCostPerWeek" required="required">
            <div class="form-control-position">
                <i class="fa fa-rupee-sign"></i>
            </div>
        </div>
    </div>

    <div class="form-group">
        <label for="lblUploadDesign">Upload Design <span class="required">*</span></label>
        <div class="position-relative has-icon-left">
            <input type="file" name="cmbUploadDesign" class="form-control" placeholder="Upoad Design" id="cmbUploadDesign" required="required">
            <div class="form-control-position">
                <i class="fa fa-upload"></i>
            </div>
        </div>
    </div>

    <div class="form-group">
        <label for="lblDescription">Description</label>
        <div class="position-relative has-icon-left">
            <textarea class="form-control" name="txtDescription" cols="5" rows="3" placeholder="Description" id="txtDescription"></textarea>
            <div class="form-control-position">
                <i class="fa fa-info"></i>
            </div>
        </div>
    </div>

    <fieldset class="form-group row">
        <div class="col-md-6 col-xs-12 text-xs-center text-md-left">
            <p id="loading_spinner"><img src="app-assets/images/icons/loading.gif"> Please Wait........</p>
        </div>
        <div class="col-md-6 col-xs-12 text-xs-center text-md-right"><input type="reset" class="btn btn-link card-link" value="Reset Values & Re-Enter!" /></div>
    </fieldset>
    <button type="submit" name="addSupplierDesignBtn" class="btn btn-primary btn-lg btn-block"><i class="fa fa-edit"></i>Add Supplier Design</button>
</form>
<script src="app-assets/js/core/libraries/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$.ajax({ url:"server/add-supplier-design.php", type:"post", async:false, success: function(SupplierNamedata) {
$("#cmbSupplierName").html(SupplierNamedata);
}, error: function() {
$("#cmbSupplierName").html("Something went wrong");
} });
</script>
    <script type="text/javascript">
function do_add_supplier_design()
{
 var supplierName = $('#cmbSupplierName').val();
 var designNumber = $('#txtDesignNumber').val();
 var pricePurchase = $('#txtPricePurchase').val();
 var priceSale = $('#txtPriceSale').val();
 var totalMarketingCostPerWeek = $('#txtTotalMarketingCostPerWeek').val();
 var uploadDesign = $('#cmbUploadDesign').val();
 var description = $('#txtDescription').val();
if(supplierName!="" && designNumber!="" && pricePurchase!="" && priceSale!="" && totalMarketingCostPerWeek!="" && uploadDesign!="")
 {
  $("#loading_spinner").css({"display":"block"});
  $.ajax
  ({
  type:'post',
  url:'server/do-add-supplier-design.php',
  data:{
    do_add_supplier_design:"do_add_supplier_design",
    supplier_id:supplierName,
    number:designNumber,
    price_purchase:pricePurchase,
    price_sale:priceSale,
    total_marketing_cost_per_week:totalMarketingCostPerWeek,
    img_upload:uploadDesign,
    description:description
  },
  success:function(response) {
  if(response=="success")
  {
    alert("You wanna to Add New Design? Hey, It's Successfull!");
    $("#loading_spinner").css({"display":"none"});
    $(".loading_spinner").text("New Design Added Successfully!");
  }
  else
  {
    alert("Opps Unable to Add New Design! Something went wrong!");
    $("#loading_spinner").css({"display":"none"});
    $(".loading_spinner").text("Try Again, Unable to Add New Design!");
  }
  }
  });
}
 else
 {
  alert("Please enter the required informations.");
  $(".loading_spinner").text("Please enter the required information.");
 }
 return false;
}
</script>

И часть PHP: - я имею в виду php-файл.

<?php 
require('../site.php'); 
include("../function/image_resize.php"); 
?>
<?php
$path = (isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] === 'on' ? "https" : "http") . "://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
$file = basename($path);
if((empty($_SESSION['authenticationid']))&&($file="do-add-supplier-design.php")) {
  header('Location: ../index.php');
}
?>
<?php 
//$img_upload = $_FILES['img_upload']['name'];
//$img_upload1 = $_FILES['img_upload1']['name'];

if(isset($_REQUEST['do_add_supplier_design'])){
    //echo "<pre>"; print_r($_REQUEST); die; 

    $sql1 = "SELECT * FROM `tbl_supplier_master` WHERE id=".$_REQUEST['supplier_id'];
    $result1 = mysqli_query($conn,$sql1) or die("Query Fail11 :".mysqli_error());
    $row1=mysqli_fetch_object($result1); 
    $supplier_name = $row1->supplier_name;
    $supplier_name_final = substr($supplier_name, 0, 2);  
    $design_number = 'B-'.$supplier_name_final.'-'.rand();

    if(is_uploaded_file($_FILES['img_upload']['tmp_name'])){

    //========================= Start Image For Thumbnel Converting ===============================================
            $prod_fullimage = rand().$_FILES['img_upload']['name'];

            list($temp_width,$temp_height) = getimagesize($prod_fullimage);

            $tag = "width";
            $Twidth = 70;
            $Theight = '';
            $uploadthumbdir = "design_img/thumbnail/";
            thumbnail($uploadthumbdir.$prod_fullimage,$_FILES['img_upload']['tmp_name'],$Twidth,$Theight,$tag);

    //========================== End Image For Thumbnel Converting ===============================================

            move_uploaded_file($_FILES['img_upload']['tmp_name'], "design_img/$prod_fullimage")or die("Failed to upload");

        } else {

            $prod_fullimage = ""; 
        }


    if(is_uploaded_file($_FILES['img_upload1']['tmp_name'])){

    //========================= Start Image For Thumbnel Converting ===============================================
            $prod_fullimage1 = rand().$_FILES['img_upload1']['name'];

            list($temp_width,$temp_height) = getimagesize($prod_fullimage1);

            $tag = "width";
            $Twidth = 70;
            $Theight = '';
            $uploadthumbdir = "design_img/thumbnail/";
            thumbnail($uploadthumbdir.$prod_fullimage1,$_FILES['img_upload1']['tmp_name'],$Twidth,$Theight,$tag);

    //========================== End Image For Thumbnel Converting ===============================================

            move_uploaded_file($_FILES['img_upload1']['tmp_name'], "design_img/$prod_fullimage1")or die("Failed to upload");

        } else {

            $prod_fullimage1 = ""; 
        }



    $sql2 = "INSERT INTO `tbl_supplier_design` SET `supplier_id`='".$_REQUEST['supplier_id']."',`number`='".$_REQUEST['number']."',`email_id`='".$_REQUEST['email_id']."',`design_slot`='".$_REQUEST['design_slot']."',`price_purchase`='".$_REQUEST['price_purchase']."',`price_sale`='".$_REQUEST['price_sale']."',`status`='".$_REQUEST['status']."',`total_marketing_cost_per_week`='".$_REQUEST['total_marketing_cost_per_week']."',`design_number`='".$design_number."',`design_img1`='".$prod_fullimage."',`design_img2`='".$prod_fullimage1."',`description`='".$_REQUEST['description']."',`created`='".date("Y-m-d H:i:s")."',`modified`='".date("Y-m-d H:i:s")."'";
    mysqli_query($conn,$sql2) or die("ERROR2::".mysqli_error());

    //echo $sql2; die;
    //header("location:view_supplier_design.php?msg=Details Successfully S//aved!!!");  
    //header("location:dashboard.php?action=list-supplier-design"); 
    echo "success";
}
?>

Я сделал ajax, но он не загружает файл, он просто вставляет текстовое содержимое в базу данных

1 Ответ

0 голосов
/ 12 сентября 2018

Похоже, вы хотите сделать что-то подобное?

if(response=="success")
{
    alert("You wanna to Add New Design? Hey, It's Successfull!");
    $("#loading_spinner").css({"display":"none"});
    // $(".loading_spinner").text("New Design Added Successfully!");
    location="dashboard.php?action=list-supplier-design";
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...