首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >使用flask-admin和sqlalchemy;现在我正在尝试创建一个表单来添加/删除/编辑表

使用flask-admin和sqlalchemy;现在我正在尝试创建一个表单来添加/删除/编辑表
EN

Stack Overflow用户
提问于 2018-09-09 05:28:17
回答 1查看 268关注 0票数 0

我创建了一个自定义视图,它以类似手风琴的方式组织我的所有产品和服务,以便数据是用户友好的。下面是我的自定义视图:

代码语言:javascript
复制
class productView(BaseView):
    form_columns = ['name','price']
    @expose('/')
    def index(self):
        myServ = Product.query.all()
        myProd =  Productcategories.query.all()
        return self.render('admin/products.html', myProd = myProd, myServ = myServ)


admin.add_view(productView(name='Products and Services', endpoint='products'))

然后我开始制作我的HTML视图,这就像黑帮杀手一样工作。我现在所处的位置是,我已经创建了一些使用我的jquery来加载模式的按钮。这也很好用。然而,我有点卡在下一步了。

一旦我点击“提交”按钮,我如何告诉它添加/删除/编辑特定的项目?

代码语言:javascript
复制
//button scripts
$(document).ready(function() {
  $(".add-category-item").click(function() {
    $('.bg-modal').fadeIn('slow');
  });

  $(".close").click(function() {
    $('.bg-modal').fadeOut('slow');
  });
});

$(document).ready(function() {
  $(".subtract-category-item").click(function() {
    $('.bg-modal').fadeIn('slow');
  });

  $(".close").click(function() {
    $('.bg-modal').fadeOut('slow');
  });
});

$(document).ready(function() {
  $(".edit-category-item").click(function() {
    var parent = $(this).attr("data-parent");
    $('#papa').val(parent);
    console.log("the parent caregory is:" + parent);
    $('.bg-modal').fadeIn('slow');
  });

  $(".close").click(function() {
    $('.bg-modal').fadeOut('slow');
  });
});
代码语言:javascript
复制
<script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
<li> {{prod.category_name}} <a class="edit-category-item" data-parent="{{prod.parent_category_id}}" href="#"><span class="glyphicon glyphicon-pencil"></span></a> <a class="subtract-category-item" href="#"><span class="glyphicon glyphicon-minus"></span></a>  <a class="add-category-item" href="#"><span class="glyphicon glyphicon-plus"></span></a></li>


<a class="edit-service-item" href="#"><span class="glyphicon glyphicon-pencil"></span></a> <a class="subtract-service-item" href="#"><span class="glyphicon glyphicon-minus"></span></a> <a class="add-service-item" href="#"><span class="glyphicon glyphicon-plus"></span></a>


<!-- Modal -->
<div style="display: none;" class="bg-modal">
  <div class="modal-contents">

    <div class="close">+</div>

    <form action="">
      <input type="text" placeholder="Name of category">
      <input type="text" id="papa">
      <a href="#" class="button">Submit</a>
    </form>

  </div>
</div>

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-09-10 04:40:43

如果您没有使用flask-admin常规删除和编辑视图,则可以公开一个将为您执行删除/编辑操作的路由,并将此路由添加为表单action

例如

代码语言:javascript
复制
class productView(BaseView):
    form_columns = ['name','price']
    @expose('/')
    def index(self):
        myServ = Product.query.all()
        myProd =  Productcategories.query.all()
        return self.render('admin/products.html', myProd = myProd, myServ = myServ)

    @expose('/custom_delete')
    def custom_delete(self):
        # write custom code to delete from the database
        return self.render('admin/products.html', myProd = myProd, myServ = myServ)

然后在你的HTML中

代码语言:javascript
复制
<div style="display: none;" class="bg-modal">
  <div class="modal-contents">

    <div class="close">+</div>

    <form action="{{url_for('.custom_delete')}}">
      <input type="text" placeholder="Name of category">
      <input type="text" id="papa">
      <a href="#" class="button">Submit</a>
    </form>

  </div>
</div>

您的表单将被提交到端点,您可以在那里处理后端的删除操作

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/52239546

复制
相关文章

相似问题

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