It should not change something on the top control (Jquery)

Please look at my Jsfiddle application, you will see a box on top with some controls. please follow these steps below in the fiddle to be able to use it

Step 1: Open the fiddle and you see an options and answers section on top. Open the grid and select either option 3, 4 or 5 as they will all display a textbox underneath in the "Number of Answers" section.

Step 2. Click "Add Question", a new row is added in the table.

Step 3: In the new row you just created, open the grid and select option "true or false" (true or false is the only option where except displaying a textbox for "Number of Answers", it displays a string which is "Only 1 Answer". Now look at the top at the answers and options feature again and you see the "Number of Answers" textbox changes to say "Only 1 Answer".

Now this should not happen, if the option is changed within one of the rows that you have added, it should only change features within that row only. If you look properly you realise in the row you have just added that the option type textbox has changed to "True or False" and that the buttons under the "Answer" column displays the buttons "True or Fals" which is what it is suppose to do. (Ignore "Number of Answers" column in new row you added, I will fix this later).

But if you look at the top control, the Option Type hasn't changed as it still says the option you have chosen between 3, 4 or 5 and the buttons in the "Answer" section hasn't changed as it still display buttons from A to (C if chosen option 3, D if chosen option 4 or E if chosen option 5). That is great, but why is it changing something in the "Number of Answers" section on top? It should leave that section alone as well if something is editted in one of the rows you have added? It should only change if the "Option Type" on top changes.

Can somebody fix this as I have been struggling on this for days. The person who will be awarded 500 points will be the one which shows a working example in the JSFiddle application. (To Save the fiddle just click on the update button on top of the fiddle and it will display a new url).

Thank you
u0867587Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

mrh14852Commented:
Updated your fiddle.

Just look for this in your JS code.

///////
///////
///////
///////
/////// Was this $('.na').show();
/////// Changed to this
            $('.na').hide();
0
u0867587Author Commented:
I didn't want you to change $('.na').show(); to  $('.na').hide();. If user selects True or false, it is suppose to show the string "Only 1 Answer". What I am saying is that if something is changed within a row you have added, it should not change anything on the top control for "Number of Answers". If option type is changed within a row you have added, it changes option type and answers buttons within the row but it does not change anything on the top control from option type and answer buttons. I want same for the "Number of Answers" on the top control.
0
mrh14852Commented:
How you have your code set up now...you are going to need to rewrite much of the logic becuase you are doing everything with a .each() function and classes.  As you add more questions to the table as soon as you change any one of the rows to "True / False" it is going to update all the rows to "1 Answre Only".

So baiscally in this block of code...you need to add some logic there to first check what is in the table cell and change it only for the row you are working with...however keep in mind that you are using classes so you need a way to differenciate each row as unique so you don't update all of them.  I suggest using IDs instead of classes.

Here is where you need to foucs.

$(this).closest('.option').siblings('.answer').find('input[name=answerFalseName]').show();

            $('.na').show();
            $('.numberAnswerTxt').val(1).hide();

        }


        getButtons();

    });

As I spent a lot of time on your other question and didn't even get partial points...I am going to leave you with this info and move on....best of luck.


0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

u0867587Author Commented:
I didn't know about partial points, how do you do that, I am more than happy to give you some points for the other question.
0
u0867587Author Commented:
Oh no, I didn't realise there is an accept multiple solutions button, i'm guessing that does it. How about I award you full points on this question to make up for it and then I post this question again?
0
mrh14852Commented:
I would have to rewrite a lot of the code in my way to get it to do what I think you want it to do.  I don't know what the full scope of your project is but by looking through your code I think you have way too much code there to do just the basic stuff.

I made the following fiddle.  In this fiddle you will find the ability to add table rows and in each row is a button that will change the text in the columns in the table.  Now just so we are clear it doesn't do all the stuff you have in the code in your fiddle...but...I think this should give you a general idea of how to generate the code and use IDs to work on each row individually.  For example add a few rows and then click "open grid" for just one of the rows.  Now that you are using IDs you can do all sorts of fancy stuff with it.  And as you can see all I have is just a few lines of code to accomplish it.  Have a look at it and see if it is helpful to you.

http://jsfiddle.net/ASHRg/1/
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
jQuery

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.