<style>
.hide_disabled .disabled {display: none;}
</style>
<form>
<label>Пол</label>
<select name="sex">
<option>мужской</option>
<option>женский</option>
</select>
<label>Семейный статус</label>
<span class="field options hide_disabled" data-xp="
enabled: [
// также, как и для select-а, но с указанием to
{on: '[name=sex] == \'мужской\'', to: '[name=status_radio]', values: ['не женат', 'женат']},
// или только с использование to
{on: '[name=sex] == \'женский\'', to: '[name=status_radio][value*=муж]'}
]
">
<input type="radio" value="не замужем" name="status_radio" id="status_radio_1" checked="true"/>
<label for="status_radio_1">не замужем</label>
<input type="radio" value="не женат" name="status_radio" id="status_radio_2"/>
<label for="status_radio_2">не женат</label>
<input type="radio" value="замужем" name="status_radio" id="status_radio_3"/>
<label for="status_radio_3">замужем</label>
<input type="radio" value="женат" name="status_radio" id="status_radio_4"/>
<label for="status_radio_4">женат</label>
</span>
</form>
AJAX-загрузка пунктов для выпадающего списка
<form>
<label>Город</label>
<select name="city">
<option value="msk">Москва</option>
<option value="spb">Санкт-Петербург</option>
</select>
<label>Район (округ)</label>
<select name="district"></select>
</form>
<script>
(function(){
xP();
var city = xP('[name=city]').last(), district = xP('[name=district]').last();
city.change(function(){
var that = this, value = this.val();
if(!this.loaded[value]){
$.ajax({
url: value + '.json',
dataType: 'json',
beforeSend: function(){
that.loaded[value] = true;
}
}).done(function(data){
district.append(data.result);
new xP.dependencies.enabled({
to: district,
on: '[name=city] == "' + value + '"',
values: data.result
});
});
}
}).loaded = {};
})();
</script>
При заполнении всех required полей
<!-- По умолчанию параметр completed_on_required = true, при необходимости можно установить в false -->
<form data-xp="completed_on_required: true">
<input data-xp="required: true" placeholder="обязательное"/>
<input type="submit" value="Отправить" data-xp="enabled_on_completed: true"/>
</form>
При правильном заполнении всех required полей
<!-- По умолчанию параметр completed_on_valid_required = true, при необходимости можно установить в false -->
<form data-xp="completed_on_valid_required: true">
<input data-xp="type: 'email', required: true" placeholder="обязательная эл. почта"/>
<input type="submit" value="Отправить" data-xp="enabled_on_completed: true"/>
</form>
