将图像id的值传递给模态框提交脚本以更新图像

时间:2017-05-16 17:04:38

标签: php mysql twitter-bootstrap

我有模态框确认,当我选择特定图像时,我想要通过新图像更改,下面代码显示当我存储图像ID的值:

    while ($row = mysqli_fetch_array($result)) {
    echo  '
    <img  id="'.$row['id'].'" data-toggle="modal" data-target="#myModal2" src = "data:image;base64,'.$row['image'].'" class="imageHieght modal-content imageStyle clickedImage w3-round-large w3-border" style="width:100%">
    <form method="post" action="'.$_SERVER['PHP_SELF'].'">               
    <button href="#" name="updateImage" type="button" class ="w3-button imageButtons w3-round-large" data-toggle="modal" data-target="#myModal1" >change</button>                
    <button href="#" name="deleteImage" class ="w3-button imageButtons w3-round-large" onclick=\'return confirm("Are you sure ?");\'>Delete</button>
    <input type="hidden"  name="imageId" value='.$row['id'].' />
    </form>
    </div>';

    }

以下代码更新图片查询:

 if(isset($_POST['submit1'])) {
        $image1 =addslashes($_FILES['image1']['tmp_name']);
        $name1 =addslashes($_FILES['image1']['name']);
        $image1= file_get_contents($image1);
        $image1= base64_encode($image1);
        $stmt = $con->prepare(" UPDATE images SET name = ? , image = ? , caption = ? WHERE id = ? ");
        $stmt->bind_param("sssi",$name1,$image1,$caption1,$id1);
        $caption1 = $_POST['imageComment1'];
        $id1 = $_POST['imageId'];
        $result = $stmt->execute();
        if ($result) {
            echo'<div class="w3-panel w3-green w3-large w3-card w3-center hideMessage">Done</div>';     
        } else {
            echo '<div class="w3-panel w3-red w3-large w3-card w3-center hideMessage">try again</div>';   
       } 
   $stmt->close();
}

问题在于$ id1,因为当我直接提供ID它的工作但当我使用$ _POST [&#39; imageId&#39;]它正在工作时,我希望我找到了答案

模态框代码:

<div class="modal fade center" id="myModal1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">   
  <div class="modal-body">
    <form role="form" method="post" class="w3-center" 
  enctype="multipart/form-data">    
    <div class="form-group">   
    <input type="file"  id="image1" name="image1"/>
    <br />
    <div class="form-group">
    <input type="text" class="form-control" id="imageComment1" 
    name="imageComment1" placeholder="" required> 
    </div>
    </div> 
    <button type="submit" name="submit1" id="save1" class="w3-button 
      imageButtons1 w3-round-large">save      
    <span class="glyphicon glyphicon-ok"></span>
    </button>
   <button type="submit" class="w3-button imageButtons2 w3-red w3-round-
     large" data-dismiss="modal">
     cancel <span class="glyphicon glyphicon-remove"></span>
    </button>
    </form>      
    </div>        
   </div>
  </div>          
 </div>

2 个答案:

答案 0 :(得分:1)

问题出在..

<input type="hidden"  name="imageId" value='.$row['id'].' />

这里生成的HTML IS ..

<input type="hidden"  name="imageId" value=Id1 />

哪个错了。

试试这个

while ($row = mysqli_fetch_array($result)) {
echo  '
<img  id="'.$row['id'].'" data-toggle="modal" data-target="#myModal2" src = "data:image;base64,'.$row['image'].'" class="imageHieght modal-content imageStyle clickedImage w3-round-large w3-border" style="width:100%">
<form method="post" action="'.$_SERVER['PHP_SELF'].'">               
<button href="#" name="updateImage" type="button" class ="w3-button imageButtons w3-round-large" data-toggle="modal" data-target="#myModal1" >change</button>                
<button href="#" name="deleteImage" class ="w3-button imageButtons w3-round-large" onclick=\'return confirm("Are you sure ?");\'>Delete</button>
<input type="hidden"  name="imageId" value="'.$row['id'].'" />
</form>
</div>';

}

答案 1 :(得分:0)

您的表单中没有imageid输入。您需要以模态形式添加它。为改变点击分配值。

首先,您需要使用以下代码替换您的更改按钮:

我添加了onclick事件,它会将id传递给jquery函数&amp;这将改变你隐藏的输入值。

<button onclick="setImgid(' . $row['id'] . ')" href="#" name="updateImage" type="button" class ="w3-button imageButtons w3-round-large" data-toggle="modal" data-target="#myModal1" >change</button>   

在脚本中添加jquery函数:

<script>
function setImgid(imgId) {
   $("#imageId").val(imgId);
}
</script> 

然后以模态形式添加<input type="hidden" id="imageId" name="imageId" />

注意:<input type="hidden" name="imageId" value='.$row['id'].' />您不需要这个,如果您不使用,可以删除。

整个代码:

 while ($row = mysqli_fetch_array($result)) {
echo  '
<img  id="'.$row['id'].'" data-toggle="modal" data-target="#myModal2" src = "data:image;base64,'.$row['image'].'" class="imageHieght modal-content imageStyle clickedImage w3-round-large w3-border" style="width:100%">
<form method="post" action="'.$_SERVER['PHP_SELF'].'">               
<button onclick="setImgid(' . $row['id'] . ')" href="#" name="updateImage" type="button" class ="w3-button imageButtons w3-round-large" data-toggle="modal" data-target="#myModal1" >change</button>               
<button href="#" name="deleteImage" class ="w3-button imageButtons w3-round-large" onclick=\'return confirm("Are you sure ?");\'>Delete</button>
<input type="hidden"  name="imageId" value='.$row['id'].' />
</form>
</div>';

}

模态框代码:

<div class="modal fade center" id="myModal1" role="dialog">
<div class="modal-dialog">
<div class="modal-content">   
  <div class="modal-body">
    <form role="form" method="post" class="w3-center" 
  enctype="multipart/form-data">    
    <div class="form-group">   
    <input type="file"  id="image1" name="image1"/>
    <br />
    <div class="form-group">
    <input type="text" class="form-control" id="imageComment1" 
    name="imageComment1" placeholder="" required> 
    </div>
    </div> 
    <input type="hidden" id="imageId" name="imageId" />
    <button type="submit" name="submit1" id="save1" class="w3-button 
      imageButtons1 w3-round-large">save      
    <span class="glyphicon glyphicon-ok"></span>
    </button>
   <button type="submit" class="w3-button imageButtons2 w3-red w3-round-
     large" data-dismiss="modal">
     cancel <span class="glyphicon glyphicon-remove"></span>
    </button>
    </form>      
    </div>        
   </div>
  </div>          
 </div>