Reducing repeated code, jQuery

dry, jquery

Solution

There's usually a way to repeat yourself less.

var myObj = {
    gender:'',
    age:'',
    children:'',
    income:'',
    stage2select:'',
    day:'',
    spend:'',
    categories:'',
    product:'',
    price:'',
    quantity:'',
    total:''
};
var dependencies = [ 'gender', 'age', 'children', 'income', 'stage2select',
  'day', 'spend', 'categories', 'product', 'price', 'quantity', 'total'];
var i;
for (i = 1; i < dependencies.length; i++) {
    if (dependencies[i] != 'stage2select') {
        var prev = dependencies[i-1];
        var next = dependencies[i];
        (function(prev, next) {
            $("#" + prev + " li").click(function() {
                myObj[prev] = $(this).text();
                $('#' + next).show();
                update();
            });
        })(prev, next);
    }
}

$("#stage2select :radio").change(function () {
    myObj.stage2select = $(this).val();
    if ( $(this).val() == 'shopping_patterns') {
            $('#day').show();
            $('#block3').hide();
            $('#block2').show();
    }
    if ( $(this).val() == 'specific_products') {
            $('#product').show();
            $('#block2').hide();
            $('#block3').show();
    }
  update();
});

function update() {
    var text = "";
    $.each(myObj, function(i){
        if (this != ''){
            if (text.length){
                text += " -> ";
            }
            text += this;
        }
    });
    $("span.jquery_out").text(text);
}

Problem

Ok, so this works perfectly well now however i'm reckoning it could be more optomised as there is a lot of repeated code. Anyone care to have a go? ``` var myObj = { gender:'', age:'', children:'', income:'', stage2select:'', day:'', spend:'', categories:'', product:'', price:'', quantity:'', total:'' }; $("#gender li").click(function() { myObj.gender = $(this).text(); $('#age').show(); update(); }); $("#age li").click(function() { myObj.age = $(this).text(); $('#children').show(); update(); }); $("#children li").click(function() { myObj.children = $(this).text(); $('#income').show(); update(); }); $("#income li").click(function() { myObj.income = $(this).text(); $('#stage2select').show(); update(); }); $("#stage2select :radio").change(function () { myObj.stage2select = $(this).val(); if ( $(this).val() == 'shopping_patterns') { $('#day').show(); $('#block3').hide(); $('#block2').show(); } if ( $(this).val() == 'specific_products') { $('#product').show(); $('#block2').hide(); $('#block3').show(); } update(); }); $("#day li").click(function() { myObj.day = $(this).text(); $('#spend').show(); $("span.jquery_out").text(text); }); $("#spend li").click(function() { myObj.spend = $(this).text(); $('#categories').show(); update(); }); $("#categories li").click(function() { myObj.categories = $(this).text(); $('#total').show(); update(); }); $("#product li").click(function() { myObj.product = $(this).text(); $('#price').show(); update(); }); $("#price li").click(function() { myObj.price = $(this).text(); $('#quantity').show(); update(); }); $("#quantity li").click(function() { myObj.quantity = $(this).text(); $('#total').show(); update(); }); function update() { var text = ""; $.each(myObj, function(i){ if (this != ''){ if (text.length){ text += " -> "; } text += this; } }); $("span.jquery_out").text(text); } ```

Original source