Marvin Jennings asked 2 weeks ago
Hello,
I am trying to create a form with a repeater field that automatically populates with data from a laboratory database AND adds the required number of rows for each item in the category. For example; Selecting Hematology generates 3 rows in the repeater field and then pulls data from the database for each test item: red cell, white cell, platelet; the reference value and units, in their respective rows.
I was trying to do this with the API function, but I cannot get it to work.
I included the javascript code so you can see:
jQuery(document).ready(function($){
var apiKey = 'xxxxxxxxxxxx';
$('#field_1023').on('change', function () {
var category = $(this).val();
var repeaterFieldClass = '.frm_repeat_sec .frm_repeat_1016 .frm_first_repeat .frm_grid_container';
var apiURL = 'https://accudiagnostics.org/wp-json/frm/v2/forms/45/entries';
if (!category) return;
console.log("Fetching data for category:", category);
$.ajax({
url: apiURL,
method: "GET",
dataType: "json",
beforeSend: function(request) {
request.setRequestHeader('Authorization', 'Basic ' + btoa(apiKey + ':x'));
},
success: function(json) {
console.log("API Response:", json);
var repeaterWrapper = $(repeaterFieldClass);
repeaterWrapper.empty();
if (json.length === 0) {
repeaterWrapper.append('
No data found for this category.
');
return;
}
$.each(json, function (index, entry) {
console.log("Processing entry:", entry);
if (entry.meta['1034'] == category) {
var newRow = $('');
newRow.append('');
newRow.append('');
newRow.append('');
repeaterWrapper.append(newRow);
}
});
},
error: function (xhr, ajaxOptions, thrownError) {
console.log("Error fetching data:", thrownError, xhr.responseText);
}
});
});
});
Victor Font Staff answered 2 weeks ago
I don't understand your workflow, but I can say your field key doesn't look correct. Formidable field keys do not have numeric suffixes as in '#field_1023'. If you understand data management's "single-source-of-truth" and application development's software portability principles, you would use a meaningful key name for your category field, something that makes sense to anyone that reads it. When rendered in HTML, Formidable's field key is selected by #field_key. It looks like you are using #field_id as your jQuery selector. I have no idea what you're doing with the rest of your code or whether it’s right for Formidable. I add rows to repeaters using a different method. I'm not familiar with what you’re doing and if ChatGPT wrote it for you, don't believe anything ChatGPT says to you about Formidable code. Architecturally, repeaters are embedded forms. It sounds like you’re trying to add these rows programmatically when the category changes in real time in the browser. If you are sure you need three repeater rows for each category and want to retrieve the related data in real time, there are several ways to do this including the use of dynamic fields. If my assumptions are correct, I recommend using the frm_repeat_start_rows hook to load the initial 3-rows. The rows will be blank. https://formidableforms.com/knowledgebase/frm_repeat_start_rows/#kb-show-ten-rows When the category changes, execute an Ajax call you run a custom callback on the server. When the data is retrieved, your populate the 3-blank rows with the JSON RESPONSE.
Marvin Jennings
replied 2 weeks ago Hi Victor,
Thank you for your response.
I was using ChatGPT to assist me since my programming knowledge is very very basic. I looked at the examples from the formidable forms API documentation and copied it over to ChatGPT to modify it since I had been working this for weeks with no luck. This is the only part of the code I cannot get to work.
I was able to get the values and units from the database (generated by another form) into the submission form when the user selected a specific test item and to determine if the results are high low or normal in real time (without having to submit the form). But I cannot get the repeater field to automatically duplicate depending on the number of items in a test category. It is not always 3, some categories can have as much as 8 items which means 8 rows, others may only have 2 rows. It varies and I wanted the repeater to duplicate to the exact number of rows equal to the number of items in a test category which would be determined by the database.
In addition to the duplication, it would auto populate the "test item" field with the tests assigned to that category. At that point it would make use of my first code which would populate the reference values and units. In a flow diagram it would be like this:
User selects a Test Category ---> Repeater field duplicated in real time to X number of rows AND populated with test names located in the specific test category.
User selects a Different Category ---> Repeater field changes in real time to X number of rows and auto populated with test names in new category.
User selects 2 categories ---> Repeater field is duplicated to X+Y number of rows and is auto populated with test names in both categories in real time.
User deselects 1 of 2 categories ---> Repeater field deletes (X-Y) number of rows and only test names of the remaining selected category is populated in real time.
Maybe I am being overzealous with my idea that this can be done. I have only seen snippets that add or update the repeater row after the entry is submitted.
I'll try your idea and see how it goes. If you have any further advice, that would be great. I hope I was able to explain my objective a little bit clearer.
"Maybe I am being overzealous with my idea that this can be done." No you are not being over zealous. Anything you can imagine can be done with Formidable with the proper planning.
Since each category has a variable number of dimensions, you could possible use JSON values derived from a lookup table to populate the repeater programmatically. It's a lot more complicated than ChatGPT can create for you and much more than I can explain here as a volunteer because of the advanced nature of the design. It requires custom PHP and jQuery and perhaps a day's worth of time.
I suggest consulting with a developer. You can find highly competent developers here: https://formidable-masterminds.com/developers-directory/. If you have budget, I would expect to pay between $500-$1,000 USD for this type of work. Good luck.
Please login or Register to submit your answer
