首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >将背景色保存/检索到数据库

将背景色保存/检索到数据库
EN

Stack Overflow用户
提问于 2017-07-15 20:49:12
回答 1查看 290关注 0票数 0

如何从select选项将颜色值插入到sql DB onclick函数中?我有一个下拉列表,可以改变表格中一些单元格的背景颜色,但如果我刷新页面,背景颜色就会消失……为了给你提供信息,我设置了

代码语言:javascript
复制
 <td style="background-color:<?php echo $row['mycolor'] ?>"><?php echo $row['mydata'] ?></td>

所以我需要保存和检索背景颜色后,从下拉列表中选择。THX

代码语言:javascript
复制
        <select id = "aircraft-state" onchange="setcolour(event,this.value)">
            <option selected="please select" >please select</option>
            <option value = "airborne" value="#4286f4"name="airborne" onClick="save(this);">airborne</option>
            <option value = "landed" value="#7eff47" name="landed" onClick="save(this);">landed</option>
        </select>


<script >
  function setcolour(e,v){
    e.preventDefault();
    var tr = e.target.parentNode.parentNode;
    switch( v ){
        case 'airborne':
            tr.childNodes[17].style.backgroundColor='#4286f4';
        break;
        case 'landed':
            tr.childNodes[17].style.backgroundColor='#7eff47';
        break;
 } 
}
</script>
EN

回答 1

Stack Overflow用户

发布于 2017-07-15 21:01:07

尝试此ajax调用...

代码语言:javascript
复制
<script>

$("#aircraft-state").on('change',function(){

var $form = $(this).closest('form');
var data = {}; // your color value send it with ajax form
$.ajax({
    url : $form.attr('action'), //url of ajax php file
    type: $form.attr('method'), // method ex. GET|POST
    data : {action: 'change_color' , color_value : $("#aircraft-state").val()")},
    success: function(response) {
    //do your success operation for color change here ...
    $("td").css('background-color', response.color_value);
    }
   });
});
</script>

在php ajax文件上执行以下代码

代码语言:javascript
复制
if(isset($_POST['action']) && $_POST['action'] == 'change_color')
{
  $color_value = $_POST['color_value'];
  //write your database update query here
  echo $color_value;exit;
}
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/45118383

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档