I'm fetching some data through JSON in a container(it is a table), which has previous & next buttons.

In each page, I'm displaying 20 records from the JSON. Now, I need to disable the 'next' button, based on the value of the property 'totalRecords' in the JSON.

Calculation:

So, let say, the value of totalRecords = 238. Which means I should have (238 /20 = 11 pages with 20 records and the last page with 18 records = 12 pages overall). So, how do I ensure that 'next' button is disabled on 12th page in this case? I mean how do I ensure that each time the next button is disabled on the last page based on the similar calculation above?

I've an array of objects (myData) which has objects with type "internal" and "external".

I'm creating divs with class="box" out of the objects in array and displaying some information of the corresponding object.

I've an edit button in the div.box, only if my object type ="external".

So, on click of the edit, I want to update the information(company or url) of that object in 'myData' array. Also, in the displayed div I'd then like to display the updated information (calling createDisplay() method again).

I've a function 'refreshDisplay' which will help me create dynamic elements. Now, I've a small condition there. In the 'src' attribute of the image, I'm going to check if the obj.picture.thumbnail starts with '/content' then append '.jpg' to the end of the obj.picture.thumbnail's value , else just use obj.picture.thumbnails' value!

Please check the image with class '.myLink' in the code. How do I achieve this?

Each row in the table has a checkbox which holds the value of the corresponding JSON object, which is basically the information about any of the users.

On selecting any of the rows, and saving to display the selected user profile, I'm also storing the selected JSON object in an array 'savedData'.

I also have an option of adding the user externally through a form which pops up on clicking 'Open External form' button. Now, I'm trying to create an object and store it in the same 'savedData' array on submitting that form. At the same time, the 'div.parent' should get generated & get appended to 'div.container' in the same format as it is for the the other users selected from the table.

Unfortunately, the 'div.parent' is not getting created, and the external object is not getting added.

I've a bootstrap form which has a few fields. By default, the 1st and the 2nd fields are mandatory.

Now, if the 3rd field is filled out, the 4th one becomes mandatory.Similarily, if the 4th field is filled out, the 3rd one becomes mandatory.

However, if both 3rd & 4th fields are not filled out, they're not mandatory.I'm also using the HTML5 form validation here.

So, here if you see, the fields Name & Date of Registration are mandatory by default.However, I'm trying to make Website mandatory when Company is filled out! And similarly, make Company mandatory, when Website is filled out!If neither company not website are filled out, both of these fields are not mandatory!

I need help for creating the JSON of the dynamicallly created dom objects which has exactly the same format, which was while receiving the JSON to create the dynamic element.

To simplify thing, I've create a dummy application, which is available in the JSFiddle link provided below.

Now, if you see, in the table I'm getting the data through JSON.

The checkbox values in the table are JSON objects.

When I select any of the checkboxes and click on Save, the corresponding div is generated and displayed.

Now, I want to save this dynamically created DOM structure using the "Save displayed data and create json'" button and also create the JSON which will be of the same format (containg all the properties (irrespective of the fact, whether they were displayed or not in the corresponding parent. for e.g., the phone number, images all the data should be available in the JSON, even it is not displayed but is available in the original JSON).

I'm working on some application wherin the data will be displayed based on some selection. The data will be selected from the table as shown in the screenshot.It gets populated in the table through some JSON.

Now, lets say, for example,

Select A & C from the table shown in the screenshot and click on 'Save'.

A & C get appended to "div.box" with ids "parent-0" and "parent-1" respectively.

Now, select A & B from the table.

Current situation: Nothing is added, and alert is shown as "Data already exists!" Ideal behaviour: B should get appended to "div.box" with id "parent-2" and alert should be shown as "A already exists!".

I've created a small application to swap divs. The user can create a div manually by entering a value in the input field or by clicking on the add button.In both the cases, the following conditions are supposed to be met.

1. All the divs should append to the parent div with class container. - working2. If a child div with class box is already present under class container, the new div with class box should add after the already available div i.e should act as a sibling to the already available div with class box. - working3. It should be possible to swap the divs with class box by clicking on top & down. - working4. The top button for the 1st div with class box should be disabled, since it will not have a top sibling to swap with. - working5. The down button for the last div with class box should be disabled, since it will not have a down sibling to swap with. - working6. The content added using the form by entering a value in the input field should also get added to the parent div as mentioned in 1. - not working7. Delete each of the divs when delete button is clicked on. - not working

All the conditions mentioned above are met except the 6th & 7th one. The delete button is not working.The div disappears as soon as it gets added.Also, is there anything that needs to be optimized in the code? Do I need to use event delegation to disable the dynamically generated top & down buttons for the first and last divs? If yes, how do I do that?