2017-06-12 283 views
0

我正在爲wordpress創建驗證帖子,意味着用戶不應該能夠提交空白字段的帖子。如何驗證wordpress中的類別和標籤字段?

這裏是jquery驗證標題和內容字段,但我無法驗證標籤和類別字段,用戶不應該能夠提交空白類別和空白標籤。任何人都可以請幫助如何使用jquery驗證wordpress中的類別和標籤字段。 categories and tags

jQuery(document).ready(function() { 
    // publish button validation 
    jQuery('#publish').click(function(){ 
     $title_value = jQuery.trim(jQuery('#title').val()); 
     if($title_value == 0 && $title_value != " "){ 
      alert('please insert title'); 
      jQuery('.spinner').css("visibility", "hidden"); 
      jQuery('#title').focus(); 
      return false; 
     } 

     $content_value = jQuery.trim(jQuery('#content').val()); 
     if($content_value == 0 && $content_value != " "){ 
      alert('Please insert content'); 
      jQuery('.spinner').css("visibility", "hidden"); 
      jQuery('#content').focus(); 
      return false; 
     } 
    }); 
+0

你可以給我們您的複選框的HTML? – Kashkain

+0

類別代碼[鏈接](https://pastebin.com/xVZWu6sh) –

+0

標籤代碼[鏈接](https://pastebin.com/Ba6Zz4JW) –

回答

0

用JQuery你可以得到類別容器並計算檢查輸入的數量。

$("#myButton").on("click", function() { 
 
    /* CATEGORY */ 
 
    // Get all the checkbox checked in your category container 
 
    var arrayChecked = $("#categorydiv input:checked"); 
 
    alert(arrayChecked.length); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="categorydiv" class="postbox "> 
 
\t <div class="handlediv" title="Click to toggle"> 
 
\t <br /> 
 
\t </div> 
 
\t <h3 class="hndle ui-sortable-handle"><span>Categories</span></h3> 
 
\t <div class="inside"> 
 
\t \t <div id="taxonomy-category" class="categorydiv"> 
 
\t \t \t <ul id="category-tabs" class="category-tabs"> 
 
\t \t \t \t <li class="tabs"><a href="#category-all">All Categories</a></li> 
 
\t \t \t \t <li class="hide-if-no-js"><a href="#category-pop">Most Used</a></li> 
 
\t \t \t </ul> 
 

 
\t \t \t <div id="category-pop" class="tabs-panel" style="display: none;"> 
 
\t \t \t \t <ul id="categorychecklist-pop" class="categorychecklist form-no-clear"> 
 
\t \t \t \t \t <li id="popular-category-1" class="popular-category"> 
 
\t \t \t \t \t \t <label class="selectit"> 
 
\t \t \t \t \t \t \t <input id="in-popular-category-1" type="checkbox" value="1"> 
 
\t \t \t \t \t \t \t Uncategorized 
 
\t \t \t \t \t \t </label> 
 
\t \t \t \t \t </li> 
 
\t \t \t \t </ul> 
 
\t \t \t </div> 
 

 
\t \t \t <div id="category-all" class="tabs-panel"> 
 
\t \t \t \t <input type="hidden" name="post_category[]" value="0"> 
 
\t \t \t \t <ul id="categorychecklist" data-wp-lists="list:category" class="categorychecklist form-no-clear"> 
 
\t \t \t \t \t <li id="category-2"> 
 
\t \t \t \t \t \t <label class="selectit"><input value="2" type="checkbox" name="post_category[]" id="in-category-2"> new</label> 
 
\t \t \t \t \t </li> 
 
\t \t \t \t \t <li id="category-6"><label class="selectit"> 
 
\t \t \t \t \t \t <input value="6" type="checkbox" name="post_category[]" id="in-category-6"> news</label> 
 
\t \t \t \t \t </li> 
 
\t \t \t \t \t <li id="category-1" class="popular-category"> 
 
\t \t \t \t \t \t <label class="selectit"><input value="1" type="checkbox" name="post_category[]" id="in-category-1"> Uncategorized</label> 
 
\t \t \t \t \t </li> 
 
\t \t \t \t </ul> 
 
\t \t \t </div> 
 
\t \t \t <div id="category-adder" class="wp-hidden-children"> 
 
\t \t \t \t <h4> 
 
\t \t \t \t \t <a id="category-add-toggle" href="#category-add" class="hide-if-no-js">+ Add New Category</a> 
 
\t \t \t \t </h4> 
 
\t \t \t \t <p id="category-add" class="category-add wp-hidden-child"> 
 
\t \t \t \t \t <label class="screen-reader-text" for="newcategory">Add New Category</label> 
 
\t \t \t \t \t <input type="text" name="newcategory" id="newcategory" class="form-required form-input-tip" value="New Category Name" aria-required="true"> 
 
\t \t \t \t \t <label class="screen-reader-text" for="newcategory_parent">Parent Category:</label> 
 
\t \t \t \t \t <select name="newcategory_parent" id="newcategory_parent" class="postform"> 
 
\t \t \t \t \t \t <option value="-1">— Parent Category —</option> 
 
\t \t \t \t \t \t <option class="level-0" value="2">new</option> 
 
\t \t \t \t \t \t <option class="level-0" value="6">news</option> 
 
\t \t \t \t \t \t <option class="level-0" value="1">Uncategorized</option> 
 
\t \t \t \t \t </select> 
 
\t \t \t \t \t <input type="button" id="category-add-submit" data-wp-lists="add:categorychecklist:category-add" class="button category-add-submit" value="Add New Category"> 
 
\t \t \t \t \t <input type="hidden" id="_ajax_nonce-add-category" name="_ajax_nonce-add-category" value="feff2a33c3"> 
 
\t \t \t \t \t <span id="category-ajax-response"></span> 
 
\t \t \t \t </p> 
 
\t \t \t </div> 
 
\t \t </div> 
 
\t </div> 
 
</div> 
 
<button id="myButton">Validate</button>

對於標籤,我需要一個標籤的HTML代碼,看看我們如何能比得上它。

編輯:標籤解決方案

$("#myButton").on("click", function() { 
 
    var tagsArray = $("#tagsdiv-post_tag .tagchecklist > span"); 
 
    alert(tagsArray.length); 
 
}); 
 

 
$(".ntdelbutton").on("click", function() { 
 
    $(this).closest("span").remove(); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="tagsdiv-post_tag" class="postbox "> 
 
\t <div class="handlediv" title="Click to toggle"> 
 
\t \t <br> 
 
\t </div> 
 
\t <h3 class="hndle ui-sortable-handle"><span>Tags</span></h3> 
 
\t <div class="inside"> 
 
\t \t <div class="tagsdiv" id="post_tag"> 
 
\t \t \t <div class="jaxtag"> 
 
\t \t \t \t <div class="nojs-tags hide-if-js"> 
 
\t \t \t \t \t <p>Add or remove tags</p> 
 
\t \t \t \t \t <textarea name="tax_input[post_tag]" rows="3" cols="20" class="the-tags" id="tax-input-post_tag"></textarea> 
 
\t \t \t \t </div> 
 
\t \t \t \t <div class="ajaxtag hide-if-no-js"> 
 
\t \t \t \t \t <label class="screen-reader-text" for="new-tag-post_tag">Tags</label> 
 
\t \t \t \t \t <div class="taghint">Add New Tag</div> 
 
\t \t \t \t \t <p> 
 
\t \t \t \t \t \t <input type="text" id="new-tag-post_tag" name="newtag[post_tag]" class="newtag form-input-tip" size="16" autocomplete="off" value=""> 
 
\t \t \t \t \t \t <input type="button" class="button tagadd" value="Add"> 
 
\t \t \t \t \t </p> 
 
\t \t \t \t </div> 
 
\t \t \t \t <p class="howto">Separate tags with commas</p> 
 
\t \t \t </div> 
 
\t \t \t <div class="tagchecklist"> 
 
\t \t \t \t <span><a id="post_tag-check-num-0" class="ntdelbutton">X</a>&nbsp;tag</span> 
 
\t \t \t \t <span><a id="post_tag-check-num-1" class="ntdelbutton">X</a>&nbsp;tag1</span> 
 
\t \t \t \t <span><a id="post_tag-check-num-2" class="ntdelbutton">X</a>&nbsp;tag2</span> 
 
\t \t \t </div> 
 
\t \t </div> 
 
\t \t <p class="hide-if-no-js"> 
 
\t \t \t <a href="#titlediv" class="tagcloud-link" id="link-post_tag">Choose from the most used tags</a> 
 
\t \t </p> 
 
\t </div> 
 
</div> 
 
<button id="myButton">Validate</button>

+0

非常感謝你kashkain,這正是我正在尋找,看看 你可以幫我在標籤。這裏是HTML [鏈接](https://pastebin.com/jjXgNtb3) –

+0

@MukulSharma我編輯我的答案,並添加一個解決方案標籤 – Kashkain

+0

再次感謝:) –

0

你可以做到這一點通過通過ACF指定標籤和分類,

從後端創建新的自定義字段,

選擇字段類型 - >分類,

帖子類型 - > post,

Taxonomy - > category,

允許空? - >不,

對post_tag做同樣的處理。

+0

感謝ginani,我試過ACF,但它是有用的,只有當我想爲用戶端創建一個表單,它不適用於管理面板的默認字段。 –