ฉันจะใช้ form.serialize ของ jQuery ได้อย่างไร แต่ไม่รวมช่องว่าง

ฉันมีแบบฟอร์มการค้นหาที่มีการป้อนข้อความและรายการแบบเลื่อนลงจำนวนหนึ่งที่ส่งผ่าน GET ฉันต้องการมี URL การค้นหาที่สะอาดกว่าโดยการลบช่องว่างออกจากสตริงคำค้นหาเมื่อทำการค้นหา

var form = $("form");  
var serializedFormStr = form.serialize();  
// I'd like to remove inputs where value is '' or '.' here
window.location.href = '/search?' + serializedFormStr

มีความคิดอย่างไรที่ฉันจะทำสิ่งนี้โดยใช้ jQuery?

ฉันดูเอกสาร jQueryแล้วและฉันคิดว่าเราสามารถทำได้ในบรรทัดเดียวโดยใช้ตัวเลือก :

$("#myForm :input[value!='']").serialize() // does the job!

เห็นได้ชัดว่า #myForm ได้รับองค์ประกอบที่มี id "myForm" แต่สิ่งที่ไม่ค่อยชัดเจนสำหรับฉันในตอนแรกคือต้องใช้อักขระเว้นวรรคระหว่าง #myForm และ: input เนื่องจากเป็นตัวดำเนินการที่สืบทอดมา

: อินพุตตรงกับองค์ประกอบอินพุตพื้นที่ข้อความเลือกและปุ่มทั้งหมด

[value! = '']เป็นแอตทริบิวต์ที่ไม่เท่ากับตัวกรอง สิ่งที่แปลก (และเป็นประโยชน์) คือทั้งหมด:ประเภทองค์ประกอบอินพุตมีคุณสมบัติค่าแม้กระทั่งเลือกและช่องทำเครื่องหมายเป็นต้น

สุดท้ายยังลบอินพุตที่ค่าคือ "." (ตามที่กล่าวไว้ในคำถาม):

$("#myForm :input[value!=''][value!='.']").serialize()

ในกรณีนี้การตีข่าวคือการวางตัวเลือกแอตทริบิวต์สองตัวติดกันหมายถึง AND การใช้ลูกน้ำหมายถึง OR ขออภัยหากเห็นได้ชัดสำหรับคน CSS!

ฉันไม่สามารถทำให้โซลูชันของ Tom ทำงานได้ (?) แต่ฉันสามารถทำได้โดยใช้.filter()ฟังก์ชันสั้น ๆ เพื่อระบุช่องว่าง ฉันใช้ jQuery 2.1.1

var formData = $("#formid :input")
    .filter(function(index, element) {
        return $(element).val() != '';
    })
    .serialize();

สิ่งนี้ใช้ได้กับฉัน:

data = $( "#my_form input").filter(function () {
        return !!this.value;
    }).serialize();

คุณสามารถทำได้ด้วยนิพจน์ทั่วไป ...

var orig = $('#myForm').serialize();
var withoutEmpties = orig.replace(/[^&]+=\.?(?:&|$)/g, '')

กรณีทดสอบ:

orig = "a=&b=.&c=&d=.&e=";
new => ""

orig = "a=&b=bbb&c=.&d=ddd&e=";
new => "b=bbb&d=ddd&"  // dunno if that trailing & is a problem or not

ฉันใช้วิธีแก้ปัญหาข้างต้นแล้ว แต่สำหรับฉันแล้วมันไม่ได้ผล ดังนั้นฉันจึงใช้รหัสต่อไปนี้

$('#searchform').submit(function(){

            var serializedData = $(this).serializeArray();
            var query_str = '';

            $.each(serializedData, function(i,data){
                if($.trim(data['value'])){
                    query_str += (query_str == '') ? '?' + data['name'] + '=' + data['value'] : '&' + data['name'] + '=' + data['value'];
                }
            });
            console.log(query_str);
            return false;
        });

อาจมีประโยชน์สำหรับใครบางคน

ฉันจะดูซอร์สโค้ดสำหรับ jQuery ในเวอร์ชันล่าสุดบรรทัด 3287

ฉันอาจเพิ่มฟังก์ชัน "serialize2" และ "serializeArray2" แน่นอนว่าพวกเขาเป็นสิ่งที่มีความหมาย

หรือวิธีที่ดีกว่าคือเขียนอะไรบางอย่างเพื่อดึง vars ที่ไม่ได้ใช้ออกจาก serializedFormStr regex บางตัวที่ค้นหา = & ในสตริงกลางหรือลงท้ายด้วย = ตัวช่วยสร้าง regex รอบ ๆ ?

UPDATE: ฉันชอบคำตอบของ rogeriopvl ดีกว่า (+1) ... โดยเฉพาะอย่างยิ่งเมื่อฉันไม่พบเครื่องมือ regex ที่ดีในตอนนี้

ทางเลือกสำหรับโซลูชันของ Rich :

$('#form').submit(function (e) {
  e.preventDefault();

  var query = $(this).serializeArray().filter(function (i) {
    return i.value;
  });

   window.location.href = $(this).attr('action') + (query ? '?' + $.param(query) : '');
});

คำอธิบาย:

• .submit()เกี่ยวกับsubmitเหตุการณ์ของแบบฟอร์ม
• e.preventDefault() ป้องกันไม่ให้ส่งแบบฟอร์ม
• .serializeArray() ให้การแสดงอาร์เรย์ของสตริงการสืบค้นที่กำลังจะถูกส่งไป
• .filter() ลบค่าเท็จ (รวมถึงค่าว่าง) ในอาร์เรย์นั้น
• $.param(query) สร้างการแสดงที่เป็นอนุกรมและเป็นไปตาม URL ของอาร์เรย์ที่อัปเดตของเรา
• การตั้งค่าเพื่อwindow.location.hrefส่งคำขอ

ในกาแฟให้ทำสิ่งนี้:

serialized_form = $(_.filter($(context).find("form.params input"), (x) -> $(x).val() != '')).serialize()

คุณอาจต้องการดูที่ฟังก์ชัน. each () jquery ที่ให้คุณวนซ้ำผ่านทุกองค์ประกอบของตัวเลือกดังนั้นวิธีนี้คุณสามารถตรวจสอบช่องป้อนข้อมูลแต่ละช่องและดูว่าว่างหรือไม่จากนั้นจึงลบออกจากแบบฟอร์ม ใช้ element.remove () หลังจากนั้นคุณสามารถจัดลำดับแบบฟอร์มได้