两个类型的输入由制表符分隔，我只能传递选项卡的输入

Question

我有一个小问题，我有一个表单和两种类型的输入，一个用于文本，一个用于图像，分别用制表符分隔。但是当键入文本时无法上传图像，并且当上传图像时无法输入文本。请按照下面的图片

无论标签如何，

始终是按钮。

然后我需要向我的代码发送所选标签的数据。

我不知道怎么做到这一点。有什么想法吗？

我正在使用CodeIgniter，只是为了注意......

Answer 1

如果您只是使用普通的GET或POST HTTP请求将表单发送到服务器，那么此表单中的所有字段都将被传输到服务器。独立于它的可见性状态或其他一些客户端技巧。

但是你可以使用javascript在将表单发送到服务器之前以某种方式转换表单。 E. g。您可以完全删除表单中的不必要字段，也可以只删除mark them as disabled。或者您可以添加一些字段，以便服务器可以确定它自己的活动选项卡，并忽略其他选项卡的内容。

Answer 2

$('.tabs-1').click(function(){
                        $('#upload-enunciado').val('');
                        $("#input-enunciado").removeAttr('disabled');
                        $("#upload-enunciado").prop('disabled', 'disabled');
                    });

                    $('.tabs-2').click(function(){
                        $('#input-enunciado').val('');
                        $("#input-enunciado").prop('disabled', 'disabled');
                        $("#upload-enunciado").removeAttr('disabled');
                    });

                    $('.tabs-3').click(function(){
                        $('#upload-1').val(''); $("#upload-1").prop('disabled', 'disabled'); $("#alternativa-1").removeAttr('disabled');
                        $('#upload-2').val(''); $("#upload-2").prop('disabled', 'disabled'); $("#alternativa-2").removeAttr('disabled');
                        $('#upload-3').val(''); $("#upload-3").prop('disabled', 'disabled'); $("#alternativa-3").removeAttr('disabled');
                        $('#upload-4').val(''); $("#upload-4").prop('disabled', 'disabled'); $("#alternativa-4").removeAttr('disabled');
                    });

                    $('.tabs-4').click(function(){
                        $('#alternativa-1').val(''); $("#alternativa-1").prop('disabled', 'disabled'); $("#upload-1").removeAttr('disabled');
                        $('#alternativa-2').val(''); $("#alternativa-2").prop('disabled', 'disabled'); $("#upload-2").removeAttr('disabled');
                        $('#alternativa-3').val(''); $("#alternativa-3").prop('disabled', 'disabled'); $("#upload-3").removeAttr('disabled');
                        $('#alternativa-4').val(''); $("#alternativa-4").prop('disabled', 'disabled'); $("#upload-4").removeAttr('disabled');
                    });